Question

我正在尝试做一些非常简单的事情，但我显然做错了什么。这是代码：

var targets = Array(
    $('.someDiv'),
    $('.myDiv')
    );
// This "for" loop check if the Class exists and if so it runs a code
for (var i = targets.length - 1; i >= 0; i--) {
    // make the target a jQuery object
    var $target = targets[i];
    // if the target exists
    if ( $target.length > 0 ) 
    {
        console.log($target);
        // run some code after every image is loaded
        $target.imagesLoaded( function()
        {
            console.log($target);
            $target.addClass('blue');
        });
    }
}

以某种方式不起作用。 JsFiddle示例是here

在没有黑客入侵图像插件的情况下传递变量是不是不可能？或者我错过了什么？

Answer 1

好消息：您的代码有效！

var myVar;
$('.myDiv').imagesLoaded( function() {
    console.log(myVar);
});

myVar是undefined，因为您没有定义它。

...尝试var myVar = "Hello World";

Answer 2

如果您希望变量保留调用imagesLoaded()时的值，您可以使用IIFE：

var myVar = 'someContent';

(function(myVar) {
    $('.myDiv').imagesLoaded( function() {
        console.log(myVar);
    });
})(myVar);

举个例子：

var myVar = 'some content';

(function(myVar) {
    setTimeout(function() {
        console.log(myVar);
    }, 1000);
})(myVar);

myVar = 'some other content';
console.log(myVar);

它会记录some other content，然后稍后some content，与初始值一样。

Answer 3

问题是{<1}}回调在已经遍历元素后触发。这意味着，当第一个回调被触发时，imagesLoaded是对数组中最后一个元素的引用。

幸运的是，由于您只是想要引用$target被调用的元素，您可以使用imagesLoaded获取对它的引用。

Updated Example

this

或者，您也可以使用var targets = [$('.someDiv'), $('.myDiv')]; for (var i = 0; i < targets.length; i++) { var $target = targets[i]; if ($target.length) { $target.imagesLoaded(function () { $(this).addClass('blue'); }); } }函数来存储每次迭代的上下文：

Updated Example

$.each()

如何在imagesLoaded回调函数中使用变量？

3 个答案: