javascript - Ajax 函数不适用于动态 div

Question

我的 onclick 功能是：

$(document).ready(function() {
    $('.mydata').click(function() {
        alert($(this).attr('data'));
    });
});​

静态元素将起作用：

<div><span id='moreinfo' class='mydata' data="25">Click Me!</span></div>
<div><span id='moreinfo' class='mydata' data="250">Click Me Too!</span></div>

但是动态填充相同元素的 div 对不会触发该函数。我究竟做错了什么？

代码示例位于：http: //jsfiddle.net/KubXr/

Answer 1

您需要事件委托：

$(function(){
  $(document).on('click', '.mydata', function() {
    alert($(this).attr('data'));
  });
});

这意味着，任何元素，无论是现有的还是未来的，动态添加的，如果包含mydata该类，都将触发事件。