在 JQuery 中，如何将选择选项的子集从一个选择菜单复制到另一个选择菜单

In JQuery, how do I copy a subset of select options from one select menu to another?

本文关键字：选择 菜单 一个 另一个 复制 子集 JQuery 选项      更新时间：2023-09-26

我正在使用JQuery 1.11.1。 我有两个选择菜单元素，一个包含以下选项

<select id="select1">
    <option value="A">option A</option>
    <option value="B">option B</option>
    ...
    <option value="">=============</option>
    <option value="AA">option AA</option>
    <option value="BB">option BB</option>
    ...
</select>

如何将选项复制到并包括带有"=============="文本到第二个选择菜单（假设第二个选择菜单有 id='select2'）。

谢谢， - 戴夫

var option, count = -1;
while ((option = $('#select1 option')[++count]).value != "")
{
  $(option).clone().appendTo('#select2');
}
$($('#select1 option')[count]).clone().appendTo('#select2'); //for the '=====' one
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="select1">
    <option value="A">option A</option>
    <option value="B">option B</option>
    <option value="">=============</option>
    <option value="AA">option AA</option>
    <option value="BB">option BB</option>
</select>
<select id="select2">
</select>

第一个解决方案：

你可以这样做：

var emptyOption = $("#select1 option").filter(function() {
                     return $.trim( $(this).val() ) == '';
                  });
var $options = emptyOption.prevAll().addBack().clone();
$('#select2').append($options);

JSFiddle： http://jsfiddle.net/inanda/uosvokdr/2/

第二种解决方案：

如果可以将类添加到要复制的选项中，则可以按以下方式执行此操作。

.HTML

<select id="select1">
    <option value="A" class="copy">option A</option>
    <option value="B" class="copy">option B</option>
    <option value="" class="copy">=============</option>
    <option value="AA">option AA</option>
    <option value="BB">option BB</option>
</select>
<select id="select2">
</select>

Javascript：

var $options = $("#select1 > option.copy").clone();
$('#select2').append($options);

工作 JsFiddle： http://jsfiddle.net/inanda/m2qd177u/1/

相关文章：