清除并刷新jQuery Chosen下拉列表

Question

我正在尝试清除jQuery Chosen下拉列表并刷新它.

HTML:

<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2">
    <option value="" selected="selected"></option>
    <option value="x">remove me</option>
</select>

当我点击"刷新"按钮时,它应该变为:

<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2">
    <option value="1">test</option>
</select>

我尝试过的:

$("#refreshgallery").click(function(){
    $('#picturegallery').empty();
    var newOption = $('<option value="1">test</option>');
    $('#picturegallery').append(newOption);
});

但我不能让它更新下拉列表...一些帮助？:)

Answer 1

使用.trigger("chosen:updated");您可以在追加后更新选项列表.

动态更新选择: 如果您需要更新选择字段中的选项并希望选择选择更改,则需要在该字段上触发"selected:updated"事件.Chosen将根据更新的内容重新构建自己.

你的代码:

$("#refreshgallery").click(function(){
        $('#picturegallery').empty(); //remove all child nodes
        var newOption = $('<option value="1">test</option>');
        $('#picturegallery').append(newOption);
        $('#picturegallery').trigger("chosen:updated");
    });

Answer 2

如果trigger("chosen:updated");不工作，使用.trigger("liszt:updated");@Nhan Tran 它工作正常。