如果可以选择多个选项,请在Select2事件中获取所选选项

时间:2016-05-21 16:05:36

标签: javascript-events html-select jquery-select2 jquery-select2-4

如何在听取<option>事件时刚刚选择的select2:select上抓住?请注意,使用单选时很简单,因为只选择一个选项时,必须是刚刚选择的选项。我还希望能够找到在使用多选(<select multiple>)时刚刚选择的选项。

select2:unselect事件中,未经选择的<option>可通过e.params.data.element获得,但在select2:select事件中则不然。我没有看到<option>不应该可用的原因,因为它是在此时创建的。但是,对于select2:selecting事件,<option>尚未创建,并且在事件触发时显然无法使用。

2 个答案:

答案 0 :(得分:16)

我已经使用以下内容来获取Select2中选择的当前版本(适用于版本4及更高版本):

// single value
var test = $('#test');
test.on("select2:select", function(event) {
  var value = $(event.currentTarget).find("option:selected").val();
  console.log(value);
});

更新:多个选定值(有和没有上次选择)

// multi values, with last selected
var old_values = [];
var test = $("#test");
test.on("select2:select", function(event) {
  var values = [];
  // copy all option values from selected
  $(event.currentTarget).find("option:selected").each(function(i, selected){ 
    values[i] = $(selected).text();
  });
  // doing a diff of old_values gives the new values selected
  var last = $(values).not(old_values).get();
  // update old_values for future use
  old_values = values;
  // output values (all current values selected)
  console.log("selected values: ", values);
  // output last added value
  console.log("last added: ", last);
});

答案 1 :(得分:0)

 $('#test').on('select2:select', function(e) {
  var data = e.params.data;
  console.log(data);
 
});