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类，则动态添加的任何现有元素或未来元素都将触发事件。