单击时更改 select2 选项答案

【问题标题】：Change select2 option on click单击时更改 select2 选项
【发布时间】：2012-12-21 09:24:23
【问题描述】：

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

<option> 值属性与链接上 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

【问题讨论】：

您正在更改所选选项的值 - 而不是更改所选选项。摆脱option:selected

标签： jquery jquery-select2

【解决方案1】：

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

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

【讨论】：

【解决方案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);
    });
});

【讨论】：

【解决方案3】：

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

【讨论】：

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

【解决方案4】：

我认为你应该这样做

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

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

【讨论】：