jquery - jQuery 图片加载回调

Question

加载后动态将图像添加到页面，然后进行用户交互，并且在该图像完全加载后无法触发功能。我认为使用 jQuery 的.load()方法会很好.. 但根据我的控制台和一堆文档.log业务，它从未执行过。见下文..谢谢！

$('body')
    .append('<img id="ad" src="img/ad.jpg" alt="Advertising Network" />')
    .load(function(){
        console.log('ad load complete');
        $('#submit').click();
    });

---

更新：

澄清一下，这是在两者document和window加载之后。

Answer 1

在您的代码.load()中与body链接有关。

将代码更改为：

var img = $('<img id="ad" src="img/ad.jpg" alt="Advertising Network" />');
img.load(function(){
    console.log('ad load complete');
    $('#submit').click();
});

$('body').append(img);

它应该可以工作（http://jsfiddle.net/zerkms/f7epb/）

Answer 2

append 函数返回包含元素，而不是附加的元素，因此您将函数绑定到 body 的负载而不是 img。

我建议使用 appendTo，如下所示：

$('<img id="ad" src="img/ad.jpg" alt="Advertising Network" />')
.load(function(){
    console.log('ad load complete');
    $('#submit').click();
})
.appendTo($('body'));