0

首先：对不起我的英语不好。

我正在创建一个函数，它可以输入具有这种格式的 javascript 对象：

var input = {
    'selector1' : {
        'event1'    : function(element,value){
            // ...
        },
        'event2'    : function(element,value){
            // ...
        },
        ...
        'eventN'    : function(element,value){
            // ...
        }
    },
    'selector2' : {
        'event1'    : function(element,value){
            // ...
        },
        'event2'    : function(element,value){
            // ...
        },
        ...
        'eventN'    : function(element,value){
            // ...
        }
    }
}

我的函数以这种方式绑定事件：

function event_binder(events_fns){
    for(sel in events_fns){
        for(ev in events_fns[sel]){
            $(sel).on(ev,function(){
                console.log(sel+'+'+ev);
                var th = $(this);
                var func_to_call = events_fns[sel][ev];
                func_to_call(th,th.html());
            });
        }
    }
}

但是当我运行它时，它显示每个事件都已绑定到最后一个事件。

我创建了一个 jsFiddle 以更好地解释我的问题：http: //jsfiddle.net/Polmonite/6rRgr/

正如console.log 所暗示的，事件绑定似乎总是使用对象中的最后一个函数。如果我的解释正确，似乎“.on”函数的评估只发生在最后，所以它使用“sel”和“ev”变量的最后一个值（范围问题），但我不'不太明白如何解决它。

谢谢你。

编辑：我需要指定一件事：我想创建 'event_binder' 函数的工作版本，而不是 jsfiddle 的工作版本，这只是一个示例。

4

1 回答 1

2

问题是范围 - 整个函数中只有一个变量sel，ev每次都会被覆盖。要创建一个新范围（带有自己的变量），您必须将它们包装在它们自己的函数中。幸运的是，jQuery 提供了一个迭代函数，您可以将函数传递给它，这样您就不会遇到这个问题：$.each. 请参阅：http: //jsfiddle.net/6rRgr/3/。

$.each(events_fns, function(sel, funcs) {
    $.each(funcs, function(ev, func) {
        $(sel).on(ev,function(){
            console.log(sel+'+'+ev);
            var th = $(this);
            func(th,th.html());
        });
    });
});
于 2013-01-04T11:07:03.750 回答