代码之家 › 专栏 › 技术社区 › TruMan1

将单击事件绑定到空选择器是否危险?

jquery-events performance jquery javascript

TruMan1 · 技术社区 · 12 年前

如果我使用 on ? 如果我自己不必显式检查选择器是否为空,这将简化我的代码,并允许我链接一些事情。

如果我在我的页面上这样做十几次,会对性能、安全性或内存泄漏产生影响吗?

$(document.body).on('click', null, function () { ... }

2 回复 | 直到 6 年前

KoenW 12 年前

如果计划动态添加元素,则使用 .on() 方法

请记住,您必须指定一个选择器,以最终定义动态添加的元素。

单击标签时,以下代码将激发。

$(document).on('click', 'label', function(e) {
    alert('dynamically added label clicked');
});

单击任何元素时,此代码都将激发。

$(document).on('click', null, function (e) {
    alert('fired regardless what element you clicked');
});

从jQuery文档:

用于筛选所选元素后代的选择器字符串它将调用处理程序。 如果选择器为空或被忽略处理程序总是在到达所选元素时调用。

Rui 12 年前

如果您的问题是引发单击事件的元素是动态添加的,那么您仍然可以在主体上使用直接事件处理程序并捕获这些事件。

委托的事件处理程序为您提供了过滤掉一些单击事件的机会,但似乎情况并非如此,因为您将选择器设置为null。

例如,如果您有一个div,并在其中添加按钮,并将事件处理程序添加到div上的单击事件,那么您将从所有按钮中捕获所有单击事件,甚至是动态添加的按钮。

<div>
    <input type="button" value="add button" id="buttonAddMore"/>
    <span id="whatClicked"></span>
</div>

$('div').on("click", function(event){
    $('#whatClicked').text("the id of the clicked element inside the div is: " + event.target.id);
});

This fiddle demonstrates this .

委派的事件还有其他微妙之处,例如,它们不会响应在它们注册的元素中引发的事件,在本例中,这将是单击div,这可能很重要。

无论哪种方式,如果您查看事件是如何注册的,在您的情况下,您可以通过调用控制台$来查看_数据(document.body,“events”),并使用您的方法查看单击事件处理程序,并使用速记版本(即。 .click 或 on("click", function() {...}) )您将看到它们生成相同的对象,除了选择器在一种情况下为null(.on(“单击”,null…),在另一种情况中为undefined(.click)