javascript - Select2 Select 函数显示以前的值

Question

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

我初始化 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>

假设我从这段代码中选择 1，我的控制台:

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

将显示“数据:选择一个优先级...”。如果我随后选择“3”，控制台将显示“DATA: 1”。

它继续显示先前选择的值。当我将“select2:selecting”更改为“select2:selected”时，控制台消息永远不会出现。

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

Answer 1

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

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

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