Question

var li = $("<li>").attr({
    id: "print",
    click: function(e){
     alert(this);
     console.log(this);
    }
 });

我已经尝试过这段代码，但它会在代码生成HTML时尽快调用。

Answer 1

var li = $("<li>",{
    id: "print"            //the second parameter accepts properties as an object
}).on('click',function(e){ //.on() binds the event to that element
    console.log(this);
});

或者：

var li = $("<li>",{
    id: "print"            //the second parameter accepts properties as an object
    click: function(e){    //attach the event as part of the properties
        console.log(this);
    }
});

Answer 2

试试这个：

var li = $('<li>').attr({
    id: "print"
}).click(function() {
    alert(this);
    consol.log(this);
});

Answer 3

您可以使用.on（）

将事件绑定到标记

一个例子：

$('li#print').on('click',function(e){
  alert("Something" + $(this));

});

Answer 4

使用'click'方法。

var li = $("<li>").attr({
   id: "print"
}).click(function(e) {
   alert(this);
   console.log(this);
});

或者，如果要将事件附加到动态生成的元素，请使用$.live函数。如果你使用jQuery mobile，我必须说另一个答案。

Answer 5

您可以使用事件冒泡并将委派的事件侦听器附加到父节点。这样做，您可以在将元素实际添加到DOM之前附加事件监听器。

或者，在尝试附加事件侦听器之前，可以将元素附加到DOM：

$("<li>")
    .attr({ id: "print"})
    .appendTo("body") // Or wherever you want to put it
    .on("click", function(e){
       alert(this);
       console.log(this);
    });

如何在我使用jquery动态创建的HTML元素上附加事件？

5 个答案: