0

任意の数のオプションを生成し、以前に準備したオプションをそれらすべてに追加したいと考えています。しかし、選択の数に関係なく、私のオプションは最後の選択にのみ追加されます。

コンソールは、すべての選択を反復したことを報告しています...

HTML:

Number of:
<input type="text" onkeyup="appendSelects(this.value);" />
<div id="container"></div>
<select style="display:none;" id="sample">
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
</select>

Javascript:

$('#container').html('');
for (var i = 0; i < n; i++) {
    $('#container').append('<select id="'+i+'"></select>');
}

var options = $('#sample option').clone();
$('#container select').each(function(){
   $(this).append(options);
    console.log('appended options to '+$(this).attr('id'));
});

フィドルはここにあります: http://jsfiddle.net/Ck9Wb/1/

どこで私は間違えましたか？

4

3 に答える 3

1 
window.appendSelects = function(n) {
    $('#container').html('');
    for (var i = 0; i < n; i++) {
        $('#container').append('<select id="'+i+'"></select>');
    }

    var options = $('#sample').html();// get by id because here we get option html 
    $('#container select').html(options);
}

デモを見る

于 2013-10-16T10:51:14.317 に答える
1

clone()変数を宣言する時点で使用する代わりにoptions、1 つのセットのみが複製され、新しく作成された要素間で移動されるため、選択に追加するときに次のselectことが必要になります。clone()

var options = $('#sample option');
$('#container select').each(function(){
   $(this).append(options.clone()); // clone here...
    console.log('appended options to '+$(this).attr('id'));
});

更新されたフィドル

于 2013-10-16T10:52:33.087 に答える