javascript - 如何将文本附加到 select2 中的所选项目？

Question

我正在尝试编辑 select2 的选定值。所以我做了这个简单的代码:

http://jsfiddle.net/rcky9/2/

HTML

<select id="sel" style="width: 100%">
    <option value="1">Hello</option>
    <option value="2">Friends</option>
    <option value="3">Stackoverflow</option>
</select>
<br><br>
<button id="addok">Add OK</button>

JS

$(document).ready(function () {

    $("#sel").select2();

    $("#addok").click(function() {
        actual_value = $("#sel").find(':selected').text();

        if (actual_value.indexOf(" OK") > -1){
            return
        }

        newtext = actual_value + " OK";

        // this works.
        $("#sel").find(':selected').text(newtext);

        // this does not works.
        $('#s2id_sel').find('.select2-choosen').text(newtext);
    });
});

如您所见，按下按钮后，看起来没有任何变化，但如果您打开下拉列表，OK 已成功添加到当前项目。

当我尝试使用 select2-choosen css 类修改 div 中的实际值时，就会出现问题。我无法通过这种方式访问​​它。

您对此有什么想法、建议或技巧吗？

Answer 1

在 select 上触发 change() 将显示附加的 ok，您需要触发 change() 没有带有 id 的元素 s2id_sel 和最后一个语句的类 .select2-choosen 不会更改文本。

<强> Live Demo

$("#sel").find(':selected').text(newtext).change();