如何使用ajax更新select2下拉列表中的数据

我有一个select2下拉列表用于location.select2数据在页面加载时初始化。我想使用ajax定期更新数据。但是当我更新select2的数据时,select2下拉列表变为只读

jQuery("#e10_2").select2({ allowClear: true, minimumInputLength: 1, data:{ results: locationls, text: function(item) { return item.text; }}, formatSelection: format, formatResult: format }); 

我真的不明白你的问题并且认为它需要一些澄清 – 但据我所知(我遇到了这个问题并在谷歌时发现了你的问题……)

当我第一次加载页面时,我运行以下JavaScript,以便我的所有下拉选择框都被设置为样式并使用select2:

 $('select').select2(); 

但正如您的标题所述,我的代码通过将下拉列表更新为一组新数据来工作 – 我的/store/ajax_get_zones函数返回选项的HTML:

 $(function() { $('#country').on('change', function() { $.post("/store/ajax_get_zones", { country_id: $('#country').val() }, function(e) { if (e) $("#state").html(e).select2(); }) }); }); 

您需要做的就是在更新数据后在元素上调用.select2()

屏幕截图

从默认的美国开始:

开始/默认美国

然后,当您更改国家/地区时,状态下拉列表也会更改(ajax更新了原始选择的内部HTML,同时仍然是主题选择2

更改国家/地区会导致州下拉列表发生变化