点击更改select2选项

Question

我在表格中使用select2插件来选取我的选择services_dd，页面上有一个类名为.js-autoselect的链接。当点击这个链接时，我想获取该链接标签的ID，并根据他们点击的按钮更改select2选项。

<option>的value属性与链接上的id属性相匹配。下面的代码成功更改了值，但是select2没有更新，它仍然显示第一个选项。

$('.js-autoselect').click(function(e){
    e.preventDefault();
    var option = $(e.target).attr('id').trim().toLowerCase(); // option =link1

    $('#services_dd option:selected').val(option);
    alert($('#services_dd option:selected').val()); // this alerts link1 which is correct

});

有人知道如何更新select2吗？

- CR41G14

---

你正在更改所选选项的值 - 而不是更改所选选项。去掉 option:selected。 - Reinstate Monica Cellio

Answer 1

$("#services_dd").select2("val", option);

请参考文档的编程访问部分：http://ivaynberg.github.com/select2/#documentation

- scottlimmer

Answer 2

工作示例

基于@scoota269的答案，我编写了以下JS Fiddle示例，展示了这个工作原理：https://jsfiddle.net/robertmassaioli/ro2279ts/5/

这应该能够帮助您了解如何使其工作。

代码

以防JS Fiddle被关闭：

$(function() {
    var select = $("#the-select");
    select.select2();

    $("#update").click(function() {
        // How to remove a value
        select.find("option[value=1]").remove();
        // How to add a value
        select.append("<option value='5'>Five</option>");
        select.select2();
    });

    $("#select").click(function() {
        // How to select a value
        var current = select.select2("val");
        current = current || [];
        current.push(2);
        select.select2("val", current);
    });
});

- Robert Massaioli

Answer 3

$('#mySelect2').val('US'); // Change the value or make some change to the internal state
$('#mySelect2').trigger('change.select2'); // Notify only Select2 of changes

- user17403436

---

欢迎来到 Stack Overflow。没有任何解释的代码很少有帮助。Stack Overflow 是关于学习的，而不是提供盲目复制粘贴的片段。请编辑您的问题并解释它如何回答所提出的具体问题。请参阅 如何回答。 - Sfili_81

Answer 4

我认为你应该简单地做

$('#services_dd').val(option);
alert($('#services_dd').val());

否则，在您的代码中，您只会更改所选选项的值属性（而不是选择元素的值）。

- Aioros