jQuery - 无法将事件绑定到动态元素？

Question

我来维护一段javascript,从服务器下载一些JSON数据,构建一个新的表行(如$('<tr></tr'))并将其插入到文档中.

该a节点在某一点上创建如下:

var a = $('<a class="foo" href="#"></a>');

然后,事件就像这样绑定到它:

a.click(function () {
  // yadda yadda

  return false;
});

唯一的问题是这似乎不起作用.绑定通过on()或不推荐使用live().处理程序简单地"忽略",从不触发,页面滚动到顶部(由于href="#").绑定事件时,该元素已append编辑为DOM.任何帮助将不胜感激.

想到的一些上下文信息:元素是在迭代数据的循环内创建的,但这不应该是一个问题,除非javascript有一些非常奇怪的东西继续使用作用域,加上我尝试使用该元素的所有其他工作:我可以更改其内容,样式,只有事件绑定不起作用.当然,jQuery版本是1.8.3.

Answer 1

EDITED

应该像这样设置.on()以使用动态创建的元素.另外,请确保使用Jquery 1.8版(最新版本)

此外,如果您不想滚动到顶部,则需要阻止单击的标准操作.

这是一个有效的FIDDLE

var a = $('<a class="foo" href="#">ASD</a>');

a.appendTo($("body"));

$('body').on('click', 'a', function(e) {
    e.preventDefault();
    $(this).after('<br/><a class="foo" href="#">ASD</a>');
});

Answer 2

我想到两件事：

1. 该链接没有文本，因此您不会点击它。
2. 你甚至没有将它附加到 dom 中。

这里有一个小提琴，其代码与您的代码非常相似。

var a = $('<a class="foo" href="#">ASD</a>');

a.click(function() {
    alert('a');
});

a.appendTo($("body"));