0

我正在尝试将负载处理程序绑定到动态创建的对象（我的生产代码中的主干视图）。我尝试使用在 jQuery 中概述的方法，如何将事件附加到动态 html 元素？, 它适用于点击处理程序，但不适用于负载处理程序。有谁知道如何解决这个问题？

这有效（使用点击处理程序）

  $(document).ready(function() {
    $("body").on("click", "img", function(){
      console.log("foo");
    });

    create();
  });

  function create(){
    $img = $("<img />").attr("src", "http://www.pureweber.com/wp-content/uploads/2011/04/jquery_icon.png");
    $("body").append($img);
  }

但这不是（使用负载处理程序）

  $(document).ready(function() {
    $("body").on("load", "img", function(){
      console.log("foo");
    });

    create();
  });

  function create(){
    $img = $("<img />").attr("src", "http://www.pureweber.com/wp-content/uploads/2011/04/jquery_icon.png");
    $("body").append($img);
  }
4

1 回答 1

2

不幸的是，使用子on选择器仅适用于冒泡的事件类型。DOMload事件不会在树中冒泡，因此它永远不会到达body您正在侦听它的位置。

请参阅http://en.wikipedia.org/wiki/DOM_events

您需要手动将处理程序附加到您创建的任何图像。

$(document).ready(function() {
  $("body img").on("load" onLoad);

  create();
});

functon onLoad(){
    console.log("foo");
}

function create(){
  $("<img />")
    .on('load', onLoad)
    .attr("src", "http://www.pureweber.com/wp-content/uploads/2011/04/jquery_icon.png")
    .appendTo('body');
}
于 2012-12-19T16:58:06.480 回答