如何使用JQuery在HTML中注册动态创建元素的事件？

Question

我使用Javascript动态添加了下表：

    <table class="ActionMenu">
<tr>
<td>
<p>Ghanshyam</p>
</td>
</tr>
</table>

我想在点击此表时获得警报..

我试过了：

$('body').on("click", ".ActionMenu tr", function (e) {
      alert("abcd");
 });

$('.ActionMenu ').on("click", "tr", function(){
   //do something
});

$('.ActionMenu').live('click',function(){});

$('#ActionTab').delegate('.someClass','click',function(){});

但以下方法都不起作用..我怎样才能实现目标？ 谢谢

Answer 1

你把代码包含在$(document).ready()块中吗？ 如果没有，那么尝试将document.ready函数包含在内部

$(function(){
$('body').on("click", ".ActionMenu tr", function (e) {
      alert("abcd");
 });

$('.ActionMenu ').on("click", "tr", function(){
   //do something
});

$('.ActionMenu').live('click',function(){});

$('#ActionTab').delegate('.someClass','click',function(){});
});

Answer 2

您的选择器有点乍一看，乍一看，请尝试：

$('table.ActionMenu tr').on('click',callback);

由于这不起作用：建议了几件事：

• 您正在使用什么版本的jQuery， on可能无法正常工作，如果您使用的是旧版本
• 你试过$(body).on('click', '.ActionMenu tr', function() { alert('clicked'); }); ？ 如果需要，用.live替换.on 。
• 一个经典的问题，但很容易被遗忘：你有没有检查过类名中的拼写错误，id是双方（服务器和jQuery）？ - 你永远都不会知道
• 所有代码都包含在$(document).ready(function(){/*script goes here...*/});
• 检查控制台是否存在可能的语法错误或其他消息

Answer 3

$(document.body).on('click', '.ActionMenu tr', function() { alert('clicked'); });

见http://jsfiddle.net/MWvMH/1/