Javascript 如何手动触发onchange事件？

我正在通过日历小部件设置日期时间文本字段值。显然，日历小部件的功能如下：

document.getElementById('datetimetext').value = date_value;

我想要的是： 在更改日期时间文本字段中的值时，我需要重置页面中的一些其他字段。我在datetimetext字段中添加了一个onchange事件监听器，该字段没有被触发，因为我猜

onchange

只有在元素获得焦点时才会被触发&它的值在失去焦点时被更改

因此，我正在寻找一种手动触发此

onchange

事件的方法（我想应该检查文本字段中的值差异）

---

有什么想法吗？

有几种方法可以做到这一点。如果

onchange

侦听器是通过

元素.onchange

属性设置的函数，并且您不担心事件对象或冒泡/传播，那么最简单的方法就是调用该函数：

element.onchange();

如果需要它完全模拟真实事件，或者通过html属性或

addEventListener

/

attachEvent

设置事件，则需要执行一些功能检测以正确触发事件：

if ("createEvent" in document) {
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("change", false, true);
    element.dispatchEvent(evt);
}
else
    element.fireEvent("onchange");

---

对于使用jQuery的用户，有一种方便的方法：

建议在现代浏览器中有一种更干净的方法：

// Assuming we're listening for e.g. a 'change' event on `element`

// Create a new 'change' event
var event = new Event('change');

// Dispatch it.
element.dispatchEvent(event);

---

谢谢这是可行的，但我不确定这里是否有浏览器检测。想知道是否有办法通过YUI库实现同样的功能。谢谢你，谢谢。似乎在Android的WebView中使用了

else

block中的3行代码。Andy E，这在IE10中不起作用，有什么想法吗？@NickBinnet:有趣。我目前在Linux中工作，无法切换到测试解决方案，但我建议交换

if

和

else

块，并测试

if（'createEvent'在文档中）

。让我知道这是否有效，我会更新答案。这是“老式方式”。现在有了。见米兰答案。@BrettZamir为我工作（至少在Chrome36中是这样）：

document.querySelector（'select.freight'）.dispatchEvent（新事件（'change'，{'bubbles'：true}））

仅供参考。。。MDN确实提到了这一点，但IE10+不支持它（根据单词modern.的定义，它也可以说是现代的），而且只有在Safari的夜间（在撰写本文时），IE10+才有此构造函数方法，但您需要指定事件的类型，例如MouseEvent或KeyboardEvent：请参阅：-这在IE11

element.dispatchEvent上不起作用（new window.Event（'change'，{bubbles:true}））

如果您想冒泡到它的

新CustomEvent（'change'）

现在（2020年6月/Covid-19）。这种“方便的方法”不会触发本机更改事件，只会触发它自己的更改事件。如果在不使用jQuery的情况下绑定事件，然后使用jQuery触发它，则绑定的回调将不会运行。感谢您的评论-我刚刚遇到了这个陷阱！对于$.trigger（'change'）来说似乎也是如此。尽管jQuery的docs状态是触发本机事件，但它与dispatchEvent（）.$（document.activeElement）的作用不同。触发器（“change”）；$（）.change（）；第二个需要jQuery