如何手动触发onchange事件？

Question

如何手动触发onchange事件？我正在通过日历小部件设置日期时间Textfield值。显然，日历部件执行如下操作：document.getElementById('datetimetext').value = date_value;我想要的是：在更改日期时文本字段中的值时，我需要重置页面中的其他一些字段。我在datetimetext字段中添加了一个onchange事件侦听器，该字段不会被触发，因为我猜onchange仅在元素获得焦点时才触发&在失去焦点时更改其值。因此，我正在寻找一种手动触发这个onchange事件(我猜应该检查文本字段中的值差异)。有什么想法吗？

Answer 1

有几种方法你可以做到。如果onchange侦听器是通过element.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");

Answer 2

MDN表明在现代浏览器中有一种更干净的方法可以做到这一点：

// Assuming we're listening for e.g. a 'change' event on `element`// Create a new 'change' eventvar event = new Event('change');
// Dispatch it.element.dispatchEvent(event);