javascript - 选择动态插入的 HTML 元素来改变一个简单的 CSS 规则

Question

我目前有一个代码可以让我“检查”表格单元格，但我动态创建的那些不适用于此。

$("td").click(function(){
        $(this).toggleClass("active");
    });

此代码适用于静态元素，但当我创建一个元素时...:

$("#boton").click(function(){
    var object = {
        name : $("#nombre").val(),
        dni : $("#dni").val(),
        telefono : $("#telefono").val()
    };

    if(count<5){
        count++;
        $("#tabla").append("<tr><td>"+object.name+"</td><td>"+object.dni+"</td><td>"+object.telefono+"</td>");
    }else{
        $("#boton").hide();
        alert("You added too much elements!");

    }

...该元素不可选择。该事件不会为此而触发。我该如何更改？

Answer 1

为了检测对当前和 future 实例的点击，您需要 delegate the event到一个确实存在的元素(例如正文):

$("body").on("click","td",function(){
    $(this).toggleClass("active");
});