1

所以我通过 ajax 加载了 x 行数据。在每一行的末尾，我添加了一个编辑按钮，该按钮将有一个点击处理程序来//做一些事情。 

$newTr.append(
    $("<img/>", {
        title: "edit task",
        "class": "edit clickable changeTask",
        src: "../../images/edit.png"
    })
)

我应该将点击处理程序附加到类：

$(document).on("click", ".changeTask", function(){ //do stuff

或者我应该将它附加到每个img：

$newTr.append(
    $("<img/>", {
        title: "edit task",
        "class": "edit clickable changeTask",
        src: "../../images/edit.png",
        click: function() {
            //do stuff
        }
    })
)

注意：这是一个严格的性能问题。两种方式都有效。另外，如果您能指出一种自己测试这种事情的方法，我将不胜感激。

4

1 回答 1

6

用你的话来说，“将它附加到课堂上”会更快。

请注意，您实际上正在做的是将单个处理程序附加到，该处理程序通过使用事件冒泡来侦听在任何元素document上触发的事件。.changeTask

这与第二个示例不同，在第二个示例中，您将单独的事件处理程序附加到每个 <img />.

这里唯一潜在的性能影响是如果您要触发数千个事件click，因为处理程序document必须检查每个事件以查看它是否相关。如果可能，将处理程序尽可能靠近元素（因为它必须过滤更少的垃圾）。 这在 99.99999% 的情况下是无关紧要的。

于 2013-01-08T15:25:48.003 回答