jQuery：如何在克隆多个下拉菜单后重置它们？

Question

目前，每次您单击“添加”按钮时，我的代码都会克隆 3 个下拉菜单。

我设法让它准确地复制行，因为之前，第一个下拉列表会自行重置，但其他两个不会，所以我只是想知道如何重置所有 3 个下拉列表？

在这个 JSFiddle 中最容易看到：

http://jsfiddle.net/jydqK/7/

所以，如果将第一个下拉列表更改为 agent，然后单击 +，您将看到第二行出现重复，而我希望将其重置为 tags、operands 和值。

非常感谢任何帮助。

Answer 1

您可以使用removeAttr删除selected属性，然后触发change()事件。

在您的情况下：

dropdownclone.find('select.tags option:selected').removeAttr('selected');
dropdownclone.find('select.tags option:first').attr('selected','selected');
dropdownclone.find('select.tags').trigger('change');

修改后的示例： http://jsfiddle.net/ZF3mc/2/

Answer 2

如果我理解你的问题，你希望重复的选择行重置它们的值。

在这种情况下，您可以删除此：

dropdownclone.find('select').each(function(index, item) {
 //set new select to value of old select
$(item).val( $dropdownSelects.eq(index).val() );
});

并将其替换为：

dropdownclone.find('option').attr('selected', false);

Answer 3

查找克隆中的所有下拉菜单。对于每个下拉列表，检查所选属性的每个选项标签并将其删除。像这样：

clone.find('select').each(function() {
    $(this).find('option').each(function() {
        $(this).removeAttr('selected');
    });
});

或者更好的是，在删除之前使用 :selected 过滤器仅查找选定的选项标签。