javascript - 如何在不克隆选择的情况下克隆选择选项

Question

假设我有一个选择:

<select id="mySelect">
 <option value="1">First</option>
 <option value="2">Second</option>
 <option value="3">Third</option>
</select>

我想克隆所有选项而不必克隆选择。这可能吗？在我的情况下无法克隆选择。

我想到了做这样的事情:

$('#mySelect').html().clone();

但这没有用。

更新:

我有一个会随时间变化的选择。我在模态中有第二个选择。调用模态时，我需要使用与第一个模态相同的选项更新模态的选择。两个选择具有不同的属性，因此我无法克隆选择。

Answer 1

将选项从主要选择复制到次要选择的最直接方法是使用 html()，如下所示:

var options = $('#mySelect').html();
$('#mySelect2').html(options);

或者在一行中:

$('#mySelect2').html($('#mySelect').html());

如果你想在复制到另一个选择之前操作选项，那么你可以使用 clone() 来获取单个选择选项的数组作为 jQuery 对象，并在复制之前改变数组全部交给另一个选择。但是，根据您将选项从一个选择复制到另一个的更新要求，使用 clone 肯定是矫枉过正。但这就是您的做法:

var optionsArr = $('#mySelect option').clone();
console.log(optionsArr); // See the contents
// Manipulate and populate other select as needed