0

ajax によって取得されたデータを選択ボックスに入力したいと思います。

最初の HTML コードは次のようになります。

<select id="myid" name="myname">
</select>

私は避ける必要がありinnerHTML、他のそのような回避策があります。使ってみappendChildましたが、うまくいかないようでした。私はプロトタイプに本当に慣れていないので、どうすればいいのか本当にわかりません。

4

1 に答える 1

1

自己作成オブジェクトのすべてのメンバーをキーと値のペアとして要素に追加したいと仮定すると、次のselectように実行できます。

var data = {
  a: 'Peter',
  b: 'Paul',
  c: 'Mary'
};

$('mySelect').update($H(data).map(function(o) {
  return '<option value="' + o.key + '">' + o.value + '</option>';
}).join(''));
​

ここにjsFiddle があります。

コードの背後にある基本的な考え方はoption、特定のデータ オブジェクトから要素を作成し、それらのすべてを文字列に変換することです。これはmapメソッドによって行われます。

は$H、データ オブジェクトを Prototype オブジェクトに変換します。これは、マップ呼び出しの最初のパラメーターにオブジェクトをHash渡すため、ここで便利です。{ key, value }

すべての要素を文字列に変換した後、それらをメソッドjoinで使用できるようにするには、空の文字列 (または、HTML 以外の任意のコード、\n も同様) を使用する必要があります。update

正直なところ、Element#updateは使用しinnerHTMLているため、実際には回避策ではありません。それを行う方法は 1 つにすぎません。

于 2012-05-24T05:36:41.103 に答える