Javascript：更新值时触发'change'事件侦听器<select>

Question

注意：不使用jQuery，在将其标记为重复之前，请确保其他Q/a是纯JS

我这样设置我的事件监听器，当通过html:触发时，它可以完美地工作

document.getElementById('activitySelector').addEventListener('change', function() {
console.log("I work triggered by html but not js")
}

我添加了额外的功能，通过javascript更改选择值，这可以使html更新，但eventListener从未被触发：

document.getElementById("activitySelector").value = interactiveType

Answer 1

要实现您想要的，您应该手动创建事件并调度。这并不困难，正如您在这里看到的：http://www.2ality.com/2013/06/triggering-events.html?m=1

Answer 2

这是我的初始解决方案。只需将事件处理程序触发您的代码包装为函数即可。这样，您就可以在通过javascript进行更新时调用相同的函数。

正如@dfsq所指出的，这就是它的工作原理。手动触发事件可能需要比这种方法更多的代码：

// All code originally in eventListener now in function
function onActivityChange() {
console.log("I work triggered by html and js")
}
// Call above function from eventlistener
document.getElementById('activitySelector').addEventListener('change', onActivityChange)
// Trigger same function after updating value
document.getElementById("activitySelector").value = interactiveType
onActivityChange()