Javascript 获得;事件“;对象在立即执行的函数中?
我以以下方式使用事件委派:Javascript 获得;事件“;对象在立即执行的函数中?,javascript,javascript-events,event-handling,Javascript,Javascript Events,Event Handling,我以以下方式使用事件委派: elWraper.onclick = (function(){ //how to get here "event" object e = e || window.event; var t = e.target || e.srcElement; //event handler return function(){ //manipulations with "t" variable } })(); 如何在
elWraper.onclick = (function(){
//how to get here "event" object
e = e || window.event;
var t = e.target || e.srcElement;
//event handler
return function(){
//manipulations with "t" variable
}
})();
如何在立即执行的函数中获取“event”对象
elWraper.onclick = function (e) {
//how to get here "event" object
e = e || window.event;
var t = e.target || e.srcElement;
//manipulations with "t" variable
};
在符合标准的浏览器中,事件对象是传递到回调函数的第一个参数。在IE中,它是一个全局变量(这是e=e | | window.event
试图确定的)。因此,立即执行函数返回的函数
应该接受声明为其第一个(通常是唯一)参数的事件对象
澄清 因为人们想知道(也许他们想知道OP为什么会接受这个答案),OP的问题并不清楚这有什么用。一种是创建变量的闭包以跟踪某些内容:
/* Count number of clicks,
* WITHOUT USING GLOBAL VARS!
*/
el.onclick = (function(){
var counter = 0;
return function(e){
e = e || window.event;
var t = e.target || e.srcElement;
counter ++;
alert('detected '+counter+' clicks!');
// do stuff with t or e ...
}
})();
此外,这是在循环中分配事件处理程序的经典方法:
/* Use double closure to break closure in loop!
*/
for (var i=0; i<stuff.length; i++) {
var el = stuff[i];
el.onclick = (function(x){
return function(e){
e = e || window.event;
var t = e.target || e.srcElement;
alert(x);
// do stuff with t or e ...
}
})(i);
}
/*使用双闭包来打破循环中的闭包!
*/
对于(var i=0;i根据您的问题,我认为slebetman的答案是正确的。但是,我不明白您所做的有什么意义。如果您试图抽象浏览器的事件差异,您可以使用类似的方法
function createHandler( context, handler ) {
return function (e) {
e = e || window.event;
var t = e.target || e.srcElement;
handler.call (context || window, e, t);
}
}
然后你可以像这样使用它
div.onclick = createHandler(div, function(e, t){
alert ("actual clicked target is " + t.id);
alert ("handler was set on node " + this.id);
});
请注意,您可以传递任何内容作为上下文(处理程序中的“this”关键字)
了解这方面的知识很好,但是jquery或许多其他LIB已经为您完成了这项工作,而且它比您的代码要经受更多的测试,并且它比这个小函数处理了更多的浏览器差异。但是如果您只需要这些,这确实可以减少代码膨胀。您的目标是什么?您正在调用一个函数,使用一个变量e
未定义(因此,脚本执行将因错误而停止)为什么要这样做而不是addEventListener
?但这不是一个“立即执行”的函数。它缺少()运算符在函数定义的末尾。@Alex JL:是的,但是在这里有一个“立即执行”函数有什么意义呢?它只是一个无关的函数。我不明白。为什么不干脆elwrapper.onclick=function(e){…}
?我也不明白(来自示例代码)但这就是OP要问的问题,这就是我要回答的问题。也许他在做一些事情,比如给一些变量创建一个闭包,让它们像静态变量一样运行。这是有用途的(这基本上就是在循环中分配事件处理程序的方式)但仅仅从OP的原始代码中还不清楚。在本例中,处理程序不使用I变量,但如果使用了,则所有处理程序的I值都是相同的(循环完成后的I值)。这是为每个处理程序使用单独I的唯一方法。
div.onclick = createHandler(div, function(e, t){
alert ("actual clicked target is " + t.id);
alert ("handler was set on node " + this.id);
});