如何使用jQuery重置jquery选择的select选项？

Question

我尝试了很多东西,似乎没有任何工作.

我正在使用jQuery和Chosen插件.

方法我尝试过:

var select = jQuery('#autoship_option');

select.val(jQuery('options:first', select).val());

jQuery('#autoship_option').val('');

jQuery('#autoship_option').text('');

jQuery('#autoship_option').empty('');

jQuery("#autoship_option option[value='']").attr('selected', true);

选择后,它始终显示Active Autoship选项.我似乎无法明确选择.

这是选择框:

<select id="autoship_option" data-placeholder="Choose Option..." 
style="width: 175px;" class="chzn-select">
    <option value=""></option>
    <option value="active">Active Autoship</option>
</select>

任何熟悉选择并能够通过一个选项清除选择框的人？(将来会有更多选择.

Answer 1

将select元素的值设置为空字符串是正确的方法.但是,这只会更新根select元素.自定义chosen元素不知道根目录select已更新.

为了通知chosen了select已被修改,你必须触发chosen:updated:

$('#autoship_option').val('').trigger('chosen:updated');

或者,如果您不确定第一个选项是否为空字符串,请使用:

$('#autoship_option')
    .find('option:first-child').prop('selected', true)
    .end().trigger('chosen:updated');

阅读此处的文档(查找标题为" 动态更新已更新"的部分).

PS旧版本的Chosen使用稍微不同的事件:

$('#autoship_option').val('').trigger('liszt:updated');

Answer 2

第一个选项应该适用:http://jsfiddle.net/sFCg3/

jQuery('#autoship_option').val('');

但是你必须确保你在像click按钮ready或文档这样的事件上运行它,就像在jsfiddle上一样.

还要确保theres始终是选项标记的值属性.如果没有,一些浏览器总是返回空val().

编辑:
现在你已经澄清了Chosen插件的使用,你必须打电话

$("#autoship_option").trigger("liszt:updated");

更改值后更新界面.

http://harvesthq.github.com/chosen/

Answer 3

尝试使用Latest Chosen JS重新加载更新的Select框.

$("#form_field").trigger("chosen:updated");

http://harvesthq.github.io/chosen/

它将使用带有Ajax的新加载选择框更新所选下拉列表.

Answer 4

尝试这个：

$("#autoship_option option[selected]").removeAttr("selected");

Answer 5

我用这个：

$('idSelect').val([]);

在 IE、Safari 和 Firefox 上测试

Answer 6

如果您使用的chosen是 jquery 插件，则要刷新或清除下拉列表的内容，请使用：

$('#dropdown_id').empty().append($('< option>'))

dropdown_id.chosen().trigger("chosen:updated")

chosen:updated事件re-build本身将基于更新的内容。