如何使用 jQuery 清除按钮单击事件的下拉列表值？

Posted 2023-02-22

【中文标题】如何使用 jQuery 清除按钮单击事件的下拉列表值？

【英文标题】：How do I clear the dropdownlist values on button click event using jQuery?

【发布时间】：2011-02-28 10:17:55

【问题描述】：

【问题讨论】：

是否要将它们重置为默认（顶部）值？

【参考方案1】：

$('#dropdownid').empty();

这将删除下拉元素下方的所有 <option> 元素。

如果您想取消选择选定的项目，请使用 Russ 的代码。

【讨论】：

将下拉菜单设置为空后，如何取回所有选项，注意下拉菜单是从数据库中填充的？

@Piyush：如果你想恢复完全相同的选项，你可以缓存它们。比如var $opts = $('select option').detach();，然后你可以稍后用$opts.appendTo('#selectID');重新插入它们

我知道如何清除它，但在我的情况下，选择选项是根据另一个下拉列表的选择从数据库中填充的。那么，我如何将默认文本放在那里，因为默认文本是来自 pre-ajaxing 的，可以这么说，所以源显示它，但 ajax 没有。只是把$('#blarg').val('Default Text'); 对我不起作用。

【参考方案2】：

如果你想重置选择的选项

$('select option:selected').removeAttr('selected');

如果你真的想删除选项（虽然我不认为你是这个意思）。

$('select').empty();

将select 替换为您情况下最合适的选择器（这可能是通过 id 或 CSS 类）。按原样使用将重置页面上的所有 <select> 元素

【讨论】：

只有这个对我有用，上面的另一个答案不起作用。

【参考方案3】：

Russ Cam 给出的第一个解决方案的更短的替代方案是：

$('#mySelect').val('');

这假设您要保留列表，但要确保不选择任何选项。

如果您希望选择特定的默认值，只需传递该值而不是空字符串。

$('#mySelect').val('someDefaultValue');

或者通过选项的索引来做，你可以这样做：

$('#mySelect option:eq(0)').attr('selected','selected'); // Select first option

【讨论】：

这是不正确的。他想清除所有选项。 val('');不这样做，它只是清除选择。你应该使用 .empty() 代替

【参考方案4】：

如果您想使用 jQuery 通过按钮单击重置引导页面：

function resetForm()
        var validator = $( "#form_ID" ).validate();
        validator.resetForm();

使用上面的代码，您还可以将字段颜色从红色更改为正常。

如果您只想重置字段值，那么：

$("#form_ID")[0].reset();