javascript - 在选定的索引更改时选择标记更改事件调用

Question

我有一个选择标签，它在 change 上有一个 eventListener。

现在我还有两个不同的按钮来改变它，它们使用:

      (selectTag).selectedIndex++;

上面的代码实现了我想要实现的目标，但它没有在 change 上调用我的回调函数。

我该怎么做？欢迎其他方法。

我更喜欢纯 JS 解决方案(请不要使用 Jquery)。

Answer 1

只是trigger 在按钮上调用click 处理程序时更改 事件:

var select = document.querySelector("select");
var button = document.querySelector("button")

select.addEventListener("change", function (e) {
  alert(e.target.value)
});

button.addEventListener("click", function () {
  var event;

  try {
    event = new Event("change")
  } catch (e) {
    event =  document.createEvent("Event");
    event.initEvent("change", true, false);
  }

  select.selectedIndex++;
  select.dispatchEvent(event);
});

JS Bin

更新:我已经更改了它在 IE 10 和其他一些可能中的工作方式。