将点击处理程序绑定到动态元素答案

【问题标题】：Binding click handler to dynamic element将点击处理程序绑定到动态元素
【发布时间】：2015-02-10 02:42:37
【问题描述】：

动态创建新链接时，无法捕捉到点击事件

$("#div").html("<a href="#" id="new">new link</a>);

$("#new").click(function(e) { //doesn't catch
   e.preventDefault();
   alert('click');
}

如何将处理程序绑定到动态元素？

【问题讨论】：

标签： javascript jquery onclick

【解决方案1】：

实际上，这对我来说很好：updated fiddle

您的原始代码中有许多语法错误。

$("#div").html("<a href='#' id='new'>new link</a>");
fixed quotes here ------^^^                      ^
fixed missing end quote here --------------------^

// works fine!
$("#new").click(function(e) {
    e.preventDefault();
    alert('click');
});

【讨论】：

不，我的例子在没有编辑器的情况下写得太快了，这是一个真正的问题
不，我在我的问题中犯了一个错误，但我真的想在加载后在 DOM 中添加项目
我不知道为什么那个小提琴不适合你；它非常适合我。你使用的是什么浏览器？您有两个选择：使用setTimeout 延迟几毫秒运行点击绑定代码（不是很好），或者尝试使用 Sukima 使用 jQuery 构建元素的建议。

【解决方案2】：

您不能通过 ID 引用创建的元素，因为它还没有被添加到 DOM 中，并且 jQuery 会在 DOM 中搜索 ID。而是保存对元素的引用并将点击附加到该元素。

var div = $('<div>').attr('id', 'div');
var link = $('<a>')
  .attr('href', '#')
  .attr('id', 'new')
  .on('click', function(e) {
    e.preventDefault();
    alert('click');
  })
  .appendTo(div);

【讨论】：

attachTo 似乎不存在
应该是appendTo。弗里肯自动更正。
它不是很直接，也不是很好，但它是一种方式！谢谢！
您是否有兴趣详细说明您觉得它写得不好的原因？我有兴趣学习不同的观点。作为参考，上面是一个典型的fluent interface（“有很多使用这种变体的 JS 库示例：jQuery 可能是最知名的。”）方法链和 jQuery DSL 是一种成熟且流行的风格管理这样的事情。可组合性提供了更多的灵活性和可读性，而不是在代码中粘贴破解的 HTML 字符串。

【解决方案3】：

You should try this post out

看起来它会回答你的问题。

总结一下，试试

$(".test").click(function () {
$.ajax({ url: 'http://.....your path...../accounts/index',
    data: {test:1},
    type: 'post',
    success: function(output) {
        //your code
             }
        }); 
});

【讨论】：

那是ajax，与点击元素无关
我看不出问题和这个答案之间没有任何联系