动态添加id后添加selected

Question

我正在显示所选插件的选项，然后向其添加选项。

下面我试试

<select id='one'>
    <option>a</option>
    <option>b</option>
</select>

并调用所选插件

$('#one').chosen();

它工作正常，现在我删除了选定的部分并向 select 框添加了新选项

$('#one').append(' <option>g</option>');
$('#one').addClass('abc').attr('id', '');
$('#one_chosen').remove();
$('.abc').attr('id', 'myid');
$('#myid').chosen();

如您所见，我已通过 class 添加了 id 并对其调用了 chosen() ，但这次它不起作用。如果没有选择

，我不能在 select 框中保留 id one

jsfiddle

Answer 1

我不确定我是否理解你的问题。但是你可以用 .trigger("chosen:updated"); 刷新 chosen 即你可以做类似

的事情

 $('.select-chosen').chosen();
 $('#one').addClass('abc').attr('id', '');

 $('.abc').attr('id', 'myid');

 $('.select-chosen').trigger("chosen:updated");

更新：

理想情况下，如果您想完全更改 select chosen，最好只隐藏并显示新的 select chosen。如果您想从 select 中选择 add 或 remove 选项并希望获得所选的完整功能，您可以使用

轻松完成

// add custom option
$(".select-chosen").append('<option>Custom Option</option>');

// remove existing option
$(".select-chosen option[value='a']").remove();

参考：http://jsfiddle.net/qubkhtsc/5/

Answer 2

您必须克隆该元素才能使其正常工作：

$('#one').chosen();

$('#one').find('option:first').remove();

$myid = $('#one').clone().attr('id', 'myid').insertBefore('#one');

$("#one, #one_chosen").remove();

$myid.show().chosen();

Updated demo

动态添加id后添加selected

Add chosen after adding id by dynamically

javascript

jquery

jquery-chosen

更新：