在 JQuery 中,如何将 select 选项的子集从一个 select 菜单复制到另一个菜单?
In JQuery, how do I copy a subset of select options from one select menu to another?
我正在使用 JQuery 1.11.1。我有两个 select 菜单元素,其中一个包含像
这样的选项
<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 菜单(假设第二个 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/
第二种方案:
如果你可以在你想复制的选项中加一个class,你可以按照下面的方式进行。
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/
我正在使用 JQuery 1.11.1。我有两个 select 菜单元素,其中一个包含像
这样的选项<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 菜单(假设第二个 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/
第二种方案:
如果你可以在你想复制的选项中加一个class,你可以按照下面的方式进行。
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/