Javascript手动触发.onchange()事件

Question

我有一个输入字段,我想分配一个新值并触发.onchange()事件.我做了以下事情:

document.getElementById("range").value='500';
document.getElementById("range").onchange();

范围是我的输入ID.我收到以下错误:

Uncaught TypeError: Cannot read property 'target' of undefined

有没有办法定义'目标'？谢谢

Answer 1

错误target是因为事件处理程序中的代码试图读取与change事件关联target的Event对象的属性.您可以尝试传入一个虚假事件来欺骗它:

var range= document.getElementById('range');
range.onchange({target: range});

或者,如果可以,更改处理程序代码以使用this而不是event.target.除非您正在使用委托(从父级捕获子对象的更改事件,对于更改事件很麻烦,因为IE不会"冒泡"它们),更改事件的目标始终是事件处理程序的元素注册,event.target多余.

如果事件处理程序使用的更多属性Event不仅仅target需要伪造更多属性,或者使用"真正的"浏览器界面来调度事件.如果事件侦听器可能正在使用(addEventListener或attachEvent在IE中),因为它们在直接onchange属性上不可见,这也是必要的.这是依赖fireEvent于浏览器的(对于IE,dispatchEvent对于标准而言),并且在较旧或较不模糊的浏览器上不可用.

Answer 2

尝试使用fireEvent或dispatchEvent(取决于浏览器)来引发事件:

document.getElementById("range").value='500';
if (document.getElementById("range").fireEvent) {
    document.getElementById("range").fireEvent("onclick");
} else if (document.getElementById("range").dispatchEvent) {
    var clickevent=document.createEvent("MouseEvents");
    clickevent.initEvent("click", true, true);
    document.getElementById("range").dispatchEvent(clickevent);
}