0

我正在构建一个小部件，该小部件在数组内的每个 jQuery DOM 元素上调用特定插件。

MyApp.forms 是一个对象数组。每个对象都有一个 jQuery 包装的 DOM 元素。

我正在执行以下操作：

$(MyApp.forms).each(function(i){
    var individualForm = this;
    /*
    individualForm is an Object {
        prop: 'value,
        $el: somejQueryElement,
        ...
    }
    */
    individualForm.$el.thePlugin({
        // options
    })
    .on('pluginEvent', function() {
        individualForm; // refers to the last object in MyApp.forms
        this; // refers to the last 
        $(this); // same problem
    }).on('pluginEvent2', function() {
        // same problem as above here.
    });
});

事件pluginEvent和pluginEvent2得到所有individualForm的$el。但是当他们开火时，我总是得到最后一个元素。
我觉得这是一个常见的 JavaScript 闭包问题。

我尝试使用for循环并创建IIFE内部但它不起作用，因为该函数在事件触发时执行。尽管这两个事件都在所有元素上触发，但我只获得附加到执行的最后一个元素的处理程序。

更新：

找到了修复。但不知道为什么以及如何工作。每个individualForm.$el元素都是一个input带有 的元素class="some-class"。

在代码的其他地方，另一位开发人员正在$('.some-class').bind(...使用旧版本的 jQuery。然后再次使用更新版本的 jQuery（使用noConflict $）。页面上有 2 个jQuery。解决方法是删除第一个.bind.

4

1 回答 1

-1

请您尝试以下方法：

$(MyApp.forms).each(function(i){
    var form = this;
    (function(individualForm) {
        individualForm.$el.on('something', function() {
            individualForm; // refers to the last object in MyApp.forms
            this; // refers to the last 
            $(this); // same problem
        }).on('somethingElse', function() {
            // same problem as above here.
        });
    })(form);
});

您应该将 individualForm 包装在一个闭包中。否则范围会改变，它指向数组的最后一个元素。

于 2013-08-21T08:57:41.980 回答