jquery - jquery：将事件添加到新创建的元素

Question

我通过 jquery 添加了一个新元素。现在我想要一个函数在单击元素时触发。我知道对此有很多答案，但它们似乎对我不起作用。不知道我在这里做错了什么。

我试过了：

new_ele = "<a>click me</a>"
new_ele.click(function() {alert('xxxx');}); 
other_ele.append(new_ele);

在添加 new_ele 之前这会失败。

我也试过（而不是上面的第二行）

new_ele.onclick = function() { alert('blah'); };

这会附加元素，但是当我单击时没有任何反应。

和

new_ele.on('click',function() {alert('ddd');});

在添加元素之前，这也会失败。

Answer 1

将其更改为：

new_ele = $("<a>click me</a>");
new_ele.click(function() {alert('xxxx');}); 
other_ele.append(new_ele);

为了添加 jQuery.click()处理程序，您需要一个可以调用该.click()方法的 jQuery 对象。您的代码试图做：

"<a>click me</a>".click(function() {alert('xxxx');}); 

这显然行不通，因为字符串上没有 click 方法。相反，您需要通过调用该 HTML 字符串将其转换为实际的 jQuery 对象$()。

Answer 2

在 .clickme 添加到 dom 之前或之后的任何位置定义。您需要确定的是 'body' 或任何其他元素已经存在于 DOM 中。第二个参数是触发路径。

$('body').on('click', 'a.clickme', function(e){
  e.preventDefault();
  console.log("clicked!");
});

$new_ele = $('<a href="#" class="clickme">click me</a>');
$("body").append( $new_elem );

Answer 3

您拥有的语句只会创建一个刺而不是元素。我认为您错过了将新创建的元素添加到 DOM。

new_ele = $("<a>click me</a>");

new_ele.appendTo(someParentElement);

new_ele.on('click',function() {alert('ddd');});