3

我的问题是我需要处理矩形的多个事件。听起来很简单,例如这行得通

  node.click(function(e){
     click(); // this is function defined in same scope, it works ok
  });

  node.mouseout(function(e){
     mouseout();  
  });

但是,我想自动化这个,所以它应该是这样的:

var events = new Array("click", "mouseout");
for(var i in events){
     node[events[i]](function(e){
         events[i](); /*THIS is problem, no matter if it is click or mouseout
                        this always fires function with same name as last item
                        in events array (in this case mouseout) 
                      */
     }
}

你知道为什么我应该如何解决它吗?

4

1 回答 1

1

您在循环中创建的处理程序共享一个变量。当它们被调用时,变量是循环中的最后一个值。

您必须使用我称之为“冻结闭包”的技术,以便每个处理程序都获得共享变量的单独副本。在您的情况下,更改的共享变量是i

你的另一个问题是你想从一个字符串中调用你的函数“click/mouseout”,所以你必须得到函数的句柄,现在你的代码正在尝试调用"hello"()它不起作用

您的最后一个问题(但还不是错误)是您不应该使用 Array 构造函数,也不应该使用for in循环来迭代数组。

function createHandler(eventName) {
    return function(e) {
        window[eventName]();
    }
}

var events = ["click", "mouseout"];
for(var i=0; i < events.length; i++){
     node[events[i]](createHandler(events[i]));
}

上面的例子更容易理解,但你可以使用自调用匿名函数来做同样的事情

var events = ["click", "mouseout"];
for(var i=0; i < events.length; i++){
     node[events[i]]((function(eventName){
         return function(e) {
             window[eventName]();
         };
     })(events[i]));
}
于 2012-12-14T20:29:40.237 回答