Question

我使用的主题是select2版本3.4.3。我想获取删除的值ID，所以我尝试使用：

$('#mymultiple').on("select2:removed", function (e) {
    console.log(e.val);
})

但它没有检测到该事件。然后，我测试了：

$('#mymultiple').on("select2:unselect", function (e) {
    console.log(e.val);
})

但是它给了我一个未定义的值，尽管该对象有一些信息：

$('#mymultiple').on("select2:unselect", function (e) {
    console.log(e);
})

对象{type：＆＃34; select2：取消选择＆＃34;，params：Object，timeStamp： 1473273802173，jQuery18308796073916839738：true，isTrigger：true， exclusive：undefined，namespace：＆＃34;＆＃34;，namespace_re：null，result： undefined，target：，...}

我必须使用这个版本，因为我需要使用模板项目给出的样式（我测试3.5.3和removed工作正常，但我无法正确导入样式）。那么如何才能从多个选择中获取删除的值？

Answer 1

似乎select2 ver 3.4.3并不支持已删除的元素事件。

您可以改为使用此解决方法：

请注意，我的代码支持删除多个元素（我不确定select2支持，但你只是为了以防万一）

＆＃13;

$(document).ready(function() {
  $("#s1").select2();
  $("#s1").data('originalvalues', []);
  $("#s1").on('change', function(e) {
    var that = this;
    removed = []
    
    $($(this).data('originalvalues')).each(function(k, v) {
      if (!$(that).val()) {
        removed[removed.length] = v;
        return false;
      }
      if ($(that).val().indexOf(v) == -1) {
        removed[removed.length] = v;
      }
    });
    
    
    if ($(this).val()) {
      $(this).data('originalvalues', $(this).val());
    } else {
      $(this).data('originalvalues', []);
    }
    
    console.log("Removed: " + removed)
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.3/select2.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.3/select2.min.js"></script>

<select id="s1" multiple="multiple">
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
</select>

＆＃13;

Answer 2

3.4.3中的事件被删除＆＃34;而不是＆＃34; select2：已删除＆＃34;

（通过查看select2 v3.4.3 source code找到它）

＆＃13;

$(document).ready(function() {
  $('#mymultiple').select2({
    placeholder: 'pick items'
  });

  $('#mymultiple').on("removed", function(e) {
    alert(e.val);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.3/select2.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.3/select2.css" rel="stylesheet" />
<select id='mymultiple' multiple>
  <option value='one'>One</option>
  <option value='two'>Two</option>
  <option value='three'>Three</option>
</select>

＆＃13;

选择2从多个

2 个答案: