jquery - jquery live 的替代方案可以工作

Question

我有这个简单的代码。 http://jsfiddle.net/borth/BmEZv/如果您单击该链接一次，它就可以正常工作。如果你点击第二次，它就不起作用了。由于 html 是在 DOM 加载后才加载到 html 中的，所以我尝试过 .on、.bind、.delegate 和 .live。除了已弃用的 .live 之外，它们都不起作用(我使用的是 jquery 1.7.2)。

有人可以解释为什么 .live 是唯一有效的函数以及为什么其他函数不起作用(或者如果我对其他函数做错了什么)。

<小时/>

$(document).ready(function(){
  $(".OpenPopup").bind('click', function(e){
      alert('test .OpenPopup');
      // do something
      return false;
  });
  $(".EditIcon").bind('click', function(){
      alert('test .EditIcon');
      // do something
      $("#ABC").html('<div class="EditIcon OpenPopup" pwidth="800" pheight="500" ptitle="EditText">click here again</div>');
  });
});


<div id="ABC"><div class="EditIcon OpenPopup" pwidth="800" pheight="500" ptitle="EditText">click here</div></div>

Answer 1

$(document).ready(function(){
        $(document.body).on('click', ".OpenPopup", function(e){
            alert('test .OpenPopup');
            // do something
            return false;
        });
        $(document.body).on('click', ".EditIcon", function(){
            alert('test .EditIcon');
            // do something
            $("#ABC").html('<div class="EditIcon OpenPopup" pwidth="800" pheight="500" ptitle="Edit Text">click here again</div>');
        });
    });