Javascript：如何将所有选项从一个select元素复制到另一个？

如何将一个select元素的所有options复制到另一个？请给我最简单的方法，我对循环过敏。Javascript：如何将所有选项从一个select元素复制到另一个？

请帮帮我。提前致谢！

2011-06-01 dpp

也许有人会发现它有帮助。我有一个类似的任务，我想复制表列的所有行的选择。我用sel1 = sel0.cloneNode（true） – Singagirl 2016-07-11 02:45:05

非常有用，@Singagirl。谢谢！请注意稍后更改ID。 – Rodrigo 2017-02-13 01:02:48

HTML：

<select id="selector_a"> 
    <option>op 1</option> 
    <option>op 2</option> 
</select> 

<select id="selector_b"> 
    <option>op 3</option> 
    <option>op 4</option> 
</select>

的javascript：

var first = document.getElementById('selector_a'); 
var options = first.innerHTML; 

var second = document.getElementById('selector_b'); 
var options = second.innerHTML + options; 

second.innerHTML = options;

来源

2011-06-01 09:11:41 helle

使用jQuery的foreach？

$("#the-id option").each(function() { 
    var val = $(this).val(); 
    var txt = $(this).html(); 
    $("the-other-id").append(
     $('<option></option>').val(val).html(txt); 
    ); 
});

来源

2011-06-01 09:08:10

男人，我讨厌循环...有没有什么办法可以做到这一点没有循环？另外，我不使用jQuery。 – dpp 2011-06-01 09:10:23

之一而不循环的最简单的方法中，使用jquery（的选择1选择2 select2 = ID select1 = ID）：

$('#select1 option').clone().appendTo('#select2');

没有jquery：

var select1 = document.getElementById("select1"); 
var select2 = document.getElementById("select2"); 
select2.innerHTML = select2.innerHTML+select1.innerHTML;

来源

2011-06-01 09:08:46 manji

好的，这是另一个问题，我不使用jQuery ...可能吗？ – dpp 2011-06-01 09:11:30

是的，看我的编辑。 – manji 2011-06-01 09:15:35

啊，谢谢！不幸的是，我不能将多个答案标记为正确。 – dpp 2011-06-01 09:23:14

你可以很容易地通过jquery:

<select id="sel1"> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
</select> 

<select id="sel2"> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
</select> 

$(document).ready(function(){ 
    $("#sel2").html($("#sel1").html()); 
});

来源

2011-06-01 09:10:28 melaos

$('#cloneBtn').click(function() { 
    var $options = $("#myselect > option").clone(); 
    $('#second').empty(); 
    $('#second').append($options); 
    $('#second').val($('#myselect').val()); 
}); 

This is used to copy the value and the innerHTML. Its better to copy the key, 
value and the OPTIONS.i.e. the selected value and the options.

来源

2014-02-10 09:36:52

我维持其运行像IE7一些IE11的 “兼容模式” 的页面，上面的纯JavaScript的解决方案做了不工作为了我。使用直接的innerHTML分配，第一个打开选项标记将被莫名其妙地剥离。

我的工作是明确地将select的选项集合中的每个选项附加到新选择。在这个例子中，它支持一个AJAX调用，所以我首先清除了列表，但我相信这也可以追加。

var fromSelect = document.getElementById('a'); 
var toSelect = document.getElementById('b'); 
toSelect.innerHTML = ""; 
for (var i = 0; i < fromSelect.options.length; i++) { 
    var option = fromSelect.options[i]; 
    toSelect.appendChild(option); 
}

希望这有助于别人谁是停留在兼容模式下，因为这个页面在列表中的谷歌搜索的顶部。

来源

2015-05-13 16:28:43 Lathejockey81

它的老线程，但我希望以下帮助某人。根本没有回路。

function copyFromMultiselect(srcId,targetId, allFlag){ 
    if(allFlag){ 
     $("#"+targetId).append($("#"+srcId).html()); 
     $("#"+srcId).empty(); 
    }else{ 
     $("#"+targetId).append($("#"+tabContentId+" #"+srcId+" option:selected")); 
    } 
    }

来源

2017-05-16 17:33:03

Javascript：如何将所有选项从一个select元素复制到另一个？

回答

相关问题