Question

我有一个背景图片，我想在每次触发ajax事件时重新加载。在背景图像加载新图像源之后，我淡入其他一些隐藏元素。

问题是，对于每个ajax加载，后台映像.load（）成功函数会触发一个额外的时间（第一次，1次加载;第二次，2次加载;等等）

[编辑以显示更多背景]

// all elements that will be updated (fades array) are faded out

// initial ajax request which includes bg image path, new content, etc
$.get( imgSrc, function(data) {

    // set background image src to preloaded image
    $("#content>img").attr({"src": imgData.src});
    $("#content>img").attr({"alt": imgData.alt});
    $("#content>img").attr({"title": imgData.title});

    // update other elements with ajax data
    [...]

    // load image and fade in all other elements
    console.log( 'begin bg image load');
    $("#content>img").load(function() {
       console.log( 'this selector matches ' + $(this).length + ' element');
       console.log( '> begin fades..');
       for(var i=0; i < fades.length; i++){
          $( fades[i] ).fadeTo(750, 1);
       }
       console.log( '> faded in ' + i + ' elements');
    });
});

当我第三次启动ajax加载时，firebug控制台会显示：

begin bg image load
this selector matches 1 element
> begin fades..
> faded in 7 elements
this selector matches 1 element
> begin fades..
> faded in 7 elements
this selector matches 1 element
> begin fades..
> faded in 7 elements

我的假设：

这不是更大循环的一部分：“begin bg image load”仅打印一次。
只有一个#content＆gt; img元素，但如果不是这种情况，这种行为会有意义。

这是否与.load（）专门针对图像进行操作有关？我在这里做错了什么？

Answer 1

只要在元素上设置src属性，就会触发图像加载。

当您致电.load()时，实际上正在注册一个新的事件处理程序，因此每次调用$.get()时，您都会重新注册处理程序，。过度，过度和过度。

jQuery img.load（）每次都会产生额外的负载

1 个答案: