javascript - 传递到 .on() 函数的变量始终是最后一个元素

Question

我用这样的对象来模拟 Backbone 的事件系统:

var events = {
    'click .one': 'fnOne',
    'click .two': 'fnTwo',
    'click .three': 'fnThree'
}

然后，为了使用 jquery 设置事件监听器，我使用以下命令:

var method,
    match,
    event_name,
    selector;

var scope = {
     // Complex object literal passed to the event's
     // function for access...
};

var delegateEventSplitter = /^(\S+)\s*(.*)$/;
for (key in events) {
    if (events.hasOwnProperty(key)) {
        method = events[key];
        match = key.match(delegateEventSplitter);
        event_name = match[1];
        selector = match[2];

        $('#element').on(event_name,selector,function(event){ 
            method(event,scope);
        });
     }
}

我遇到的问题是它绑定(bind)正确，除了所有事件都会触发最后一个函数fnThree

Answer 1

只是一个闭包/循环问题。闭包仅绑定(bind)词法名称，而不绑定(bind)当时的值。

我最喜欢的捕获值的方法之一是with:

for (key in events) {
    if (events.hasOwnProperty(key)) {
        method = events[key];
        match = key.match(delegateEventSplitter);
        event_name = match[1];
        selector = match[2];

        with ({method:method})
        {
            $('#element').on(event_name,selector,function(event){ 
               method(event,scope);
            });
        }
    }
}

但这会导致道格·克罗克福德的一些追随者死于心脏病，所以你也可以这样做:

            (function(method) { $('#element').on(event_name,selector,function(event){ 
               method(event,scope);
            }); })(method);

我会让您决定您更喜欢哪个。