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

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

  •  1
  • TruMan1  · 技术社区  · 10 年前

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

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

    $(document.body).on('click', null, function () { ... }
    
    2 回复  |  直到 5 年前
        1
  •  2
  •   KoenW    10 年前

    如果计划动态添加元素,则使用 .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文档:

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

        2
  •  1
  •   Rui    10 年前

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

    委托的事件处理程序为您提供了过滤掉一些单击事件的机会,但似乎情况并非如此,因为您将选择器设置为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)