通过Jquery append方法添加的img元素被执行了两次onload事件

似乎是Jquery的一个Bug,因为一般来说,在任何情况下都不应该重复触发onload事件。

重现Bug的代码如下:

$(function(){ 
    $("#test").append('<img onload="alert(\'hi\')" src="Image.jpg">');
})

百般百度无果,最终在StackOverFlow上找到了同样的问题:

http://stackoverflow.com/questions/10816053/jquery-img-added-through-append-triggers-onload-twice

该问题中给出的回答是Jquery在create和shift元素的时候都会导致触发onload事件。听上去并不是很科学。不过至少给出了一种可以避免Bug的写法:

$(function() {
    $("#test").append(
        $("<img>").attr({
            src: "Bachalpseeflowers.jpg",
            onload: "alert(\'hi\')"
        })
    );
});

或者,可以使用$('#test').html()方法代替append方法添加包含onload事件的图片。

相关文章
3条评论
  • 市政工程市场

    市政工程市场

    2013年12月18日 15:27:26

    评论能拯救世界

  • 生态城市规划市场调研报告

    生态城市规划市场调研报告

    2013年12月26日 15:17:18

    你的博文通俗易懂,文风好;你的博文直面现实,结合好

  • 电子阅读器

    电子阅读器

    2014年01月06日 14:45:16

    传递正能量

留下评论

电子邮件地址不会被公开。 必填项已用*标注