Select2 Select 函数显示以前的值

Question

我正在使用 Select2 作为搜索下拉菜单，但是当我 select 列表中的一个项目时，它一直显示以前的值。

我初始化 Select2 下拉菜单：

$(document).ready(function() {
  $(".ordersSelect").select2();
});

然后设置所有选项：

<select class="ordersSelect" style="width:75%;">
  <option value>Select a priority...</option>
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
</select>

假设我 select 1，我的控制台来自这段代码：

// when value is selected
$('.ordersSelect').on('select2:selecting', function(e) {
  var prioritySelection = $('.ordersSelect').select2('data')[0].text;
  console.log("DATA: " + prioritySelection);
});

将显示 "DATA: Select a priority..."。如果我然后 select 说“3”，控制台将显示 "DATA: 1".

它继续显示前一个 selection 的值。当我将 "select2:selecting" 更改为 "select2:selected" 时，控制台消息永远不会出现。

我在这里做错了什么..？

Answer 1

首先，你一定要使用select2:select。
select2:selecting 在选择结果之前触发..

$('select').on('select2:select', function (evt) {
  // Do something
});

其次，您可以从事件本身获取数据object/value。检查 evt.params.data 属性.

Answer 2

使用以下方法获取：

$('.ordersSelect').select2().on("change", function(e) {
  var obj = $(".ordersSelect").select2("data");
  console.log("change val=" + obj[0].id);  // 0 or 1 on change
});

如果有人知道更好的方法，我绝对愿意听听。

Select2 Select 函数显示以前的值

Select2 Select Function Shows Previous Value

javascript

jquery

jquery-select2

jquery-select2-4

select2