如何獲取 select2:unselect 的值

Question

如何使用select2:unselect在Select2中獲取未選擇選項的值

$('#mySelect').on("select2:unselect", function(e){

    var unselected_value = $('#mySelect').val(); // using this shows 'null'
    // or using below expression also shows 'null'
    var unselected_value = $('#mySelect :selected').val();

    alert(unselected_value);
}).trigger('change');

在上面的代碼警報中顯示“空”

我需要使用select2:unselect因為 'change' 事件會感知:select和:unselect兩者。

Answer 1

這是一個較舊的問題，但也許這個答案會對某人有所幫助。 我正在使用具有多個值/標簽的 Select2 v4.0.3，只需要刪除特定值/標簽的 ID。 我真的不想使用其他答案中提到的unselecting事件。 在unselect事件中沒有args對象，因此您可以像這樣獲取您要刪除的對象的 ID ...

jQuery('.mySelect2').on("select2:unselecting", function(e){
    return true; // I don't use this unselecting event but here is how you could use it to get the ID of the one you are trying to remove.
    console.log(e);
    console.log(e.params);
    console.log(e.params.args.data);
    console.log(e.params.args.data.id);
    //console.log(e.params.args.data.tag); data.tag is specific to my code.
});

jQuery('.mySelect2').on('select2:unselect', function (e) {
    console.log(e);
    console.log(e.params);
    console.log(e.params.data);
    console.log(e.params.data.id);
    //console.log(e.params.data.tag); data.tag is specific to my code.

    /*
    Now you can do an ajax call or whatever you want for the specific
    value/tag that you are trying to remove which is: e.params.data.id.
    */

Answer 2

實際上，數據值在事件對象中。 如果您正在處理 select2 多個值，這將很有用。

function(e){
    console.log(e.params.data)
}

Answer 3

最后，我得到了解決方案，那就是：未選中選項的值僅在未選中之前可用。 不在select2:unselect而在select2:unselecting現在代碼將是：

$('#mySelect').on("select2:unselecting", function(e){
         var unselected_value = $('#mySelect').val();
         alert(unselected_value);
    }).trigger('change');

Answer 4

未選擇的元素正在通過 e.params.data 傳遞。 我們可以使用“id”訪問它的值，如果您需要文本，可以使用“data.text”。

 $("select").on("select2:unselect", function (e) {
             var value=   e.params.data.id;
             alert(value);
    });

Answer 5

如果您使用多個標簽，則獲取特定的選項值：

var unselected_value = $('#mySelect option:selected').val();
alert(unselected_value);

Answer 6

這是我在 SVG 地圖中更改城市背景顏色以查找特定城市名稱的解決方案。 希望這可以幫助你

 $(".js-example-diacritics").on("select2:unselect", function(evt) {
                var element = evt.params.data.element;
                townColor(element.text, unHighLightColor);
            });

我向方法 townColor() 傳遞了未選中的 select2 元素的文本（城市名稱）和名為 unHighLightColor 的常量，其中包含顏色名稱。

Answer 7

在 Select2 4.0.3 上，我發現e.params已更改。 因此，要從取消選擇的項目中查找 id，請像這樣更改您的代碼：

$('select').on('select2:unselecting', function (e) {
    var id = e.params.args.data.id; //your id
    alert('Are You Sure ?');
    e.preventDefault();
  // Do something with your id
});

Answer 8

使用 $(this).val()，這將返回您在選擇中標記的最后一個值

$('#mySelect').on("select2:unselecting", function(e){
         alert($(this).val());
    })

Answer 9

@Mahmaood ali 感謝您提供的解決方案，它對我來說就像一個魅力。

對於@Vipin Kr。 辛格問題。

  $('#mySelect').on("select2:unselect", function(e){
        var unselected_value = e.params.data.id;
    })
    $('#mySelect').on("select2:select", function(e){
        var selected_value = e.params.data.id;
    })

這樣，您一次只能獲得一個選定或未選定的值。