Javascript 为什么在我的例子中事件对象是未定义的

当点击一个按钮时，我想在现代浏览器中获取事件对象

e

，如

Firefox

，

Chrome

，

等

。 问题是当单击按钮时给我一个

未定义的
事件对象，请注意，当使用
窗口时，
internet explorer中的事件
会获取事件对象

// the Object
var countdown = {
    hours: 0,
    minutes: 0,
    seconds: 0,
    element_h: null,
    element_m: null,
    element_s: null,
    init: function (hElemId, mElemId, sElemId) {
        this.element_h = document.getElementById(hElemId);
        this.element_m = document.getElementById(mElemId);
        this.element_s = document.getElementById(sElemId);
    },
    play: function (e){
        alert(e.target);
    }
};

HTML:

<button onclick="countdown.play();">Play</button>

播放
您必须显式地将
事件
对象传递给onclick处理程序，如下所示

<button onclick="countdown.play(event);">Play</button>

播放

引用

属性中的JavaScript代码通过事件参数传递给事件对象

当您内联注册事件处理程序时，可以使用
event
参数为其提供
event
对象。但这不会自动完成。这就是为什么我们必须显式地传递
事件
对象的原因。由于您没有传递它，
e
在默认情况下是
未定义的
。
事件对象作为第一个参数通过名称
event
（或者在IE是全局变量的情况下）传递给事件处理程序。您将拾取参数/变量并将其传递给方法

请注意，IE8及更早版本不支持
target
属性，因此您需要对以下内容使用
srcElement
属性：


var倒计时={
小时:0，
分钟:0，
秒：0，
元素h:null，
元素m:null，
元素_s:null，
初始化：函数（hElemId、mElemId、sElemId）{
this.element_h=document.getElementById（hElemId）；
this.element_m=document.getElementById（mElemId）；
this.element_s=document.getElementById（sElemId）；
},
播放：功能（e）{
警报（e.target | | e.src元素）；
}
};
播放
“为什么在我的案例中未定义事件对象”

原因如下。绑定内联处理程序时，将创建一个匿名函数并将其放在元素的
onclick
属性上

根据浏览器的不同，该处理程序将如下所示：

// IE 8 and lower
elem.onclick = function() {
    countdown.play(); // <-- Invoking your method, but not passing anything
}


// Other browsers
elem.onclick = function(event) {
    countdown.play(); // <-- Invoking your method, but not passing anything
}

// IE 8 and lower
elem.onclick = function() {
    countdown.play(event); // <-- there's no parameter, but there is `window.event`
}


// Other browsers
elem.onclick = function(event) {
    countdown.play(event); // <-- it's just passing the parameter
}

现在看起来像这样：

// IE 8 and lower
elem.onclick = function() {
    countdown.play(); // <-- Invoking your method, but not passing anything
}


// Other browsers
elem.onclick = function(event) {
    countdown.play(); // <-- Invoking your method, but not passing anything
}

// IE 8 and lower
elem.onclick = function() {
    countdown.play(event); // <-- there's no parameter, but there is `window.event`
}


// Other browsers
elem.onclick = function(event) {
    countdown.play(event); // <-- it's just passing the parameter
}

因为您将传递一个未在任何地方定义的变量

// IE 8 and lower
elem.onclick = function() {
    countdown.play(e); // <-- there's no `e` defined in here
}


// Other browsers
elem.onclick = function(event) {
    countdown.play(e); // <-- there's no `e` defined in here
}

//IE 8及更低版本
elem.onclick=函数（）{
倒计时。播放（e）；//你能显示完整的源代码吗？源代码的部分看起来像是正确的关键字
event
is必须按原样添加，否则我可以将单词更改为任何内容？@LionKing
event
指的是
窗口。event
对象。因此，它必须完全相同。有任何方法可以在e对象不在外部，因为当使用对象时，用户不知道是否必须添加
event
参数。我想让使用此对象的用户有一个简单的方法。@l链接包含事件侦听器的最佳方法是使用
addEventListener
。您根本不必编写
onclick
属性和
addEve>ntListener
是今后的首选方法。请看一下使用它的优点。因此，回答您的问题，不，注册事件处理程序的方式是不可能的。这很好，但是大多数浏览器不支持在内联事件属性中使用
事件
（用于与旧IE的向后兼容性）还是
参数[0]
最新浏览器是否需要测试？@nnnnnn是正确的。不需要
参数[0]| |
只要参数被完整地拼写为
事件
@nnnnnn：经过一些测试，我验证了它们的正确性。此外，为了与IE8及更早版本的向后兼容性，我们必须使用
src元素
，因为它们不支持
目标
属性。