jQuery 事宜的定名空间

用 jQuery 绑定息争绑事宜监听器都是异常简朴的。然则当你为一个元素的一个事宜绑定了多个监听器时,如何精确地解绑个中一个监听器?我们须要相识一下事宜的定名空间。

看下面这段代码:

$(“#element”)
    .on(“click”, doSomething)
    .on(“click”, doSomethingElse);

像上面如许绑定事宜监听器,当元素被点击时,doSomethingdoSomethingElse 这两个监听器都会被触发。这是运用 jQuery 的一个轻易的地方,可以随时给元素的同一个事宜增加差别的监听器。不像用 onclick 那样,新的监听器会掩盖旧的。

假如你想解绑个中一个监听器,比方 doSomething,怎么做呢?

是如许吗?

$(“#element”).off(“click”);

注重!上面这行代码会把元素的 click 事宜的一切监听器悉数解绑,而这并非我们要的效果。

荣幸的是 jQuery 的 .off() 要领可以接收第二个参数,就像 .on() 一样。只要把监听器函数的名字作为第二个参数传入 .off() 要领,就可以解绑指定的监听器。

$(“#element”).off(“click”, doSomething);

然则假如你不知道这个函数的名字,或许你用的是匿名函数:

$(“#element”)
    .on(“click”, function() {
        console.log(“doSomething”);
    });

如何才能精确地解绑某一个 click 事宜监听器呢?该相识一下 jQuery 的事宜定名空间了

先上代码:

$(“#element”)
    .on(“click.myNamespace”, function() {
        console.log(“doSomething”);
    });

这里不只是把 click 事宜作为参数传入 .on() 要领,而是给 click 事宜指定了一个定名空间,然后监听了这个定名空间里的 click 事宜。此时,纵然监听器是匿名函数,实际上它也是“著名”的了。如今你可以像下面如许解绑某一个详细的定名空间里的事宜监听器了。

$(“#element”).off(“click.myNamespace”);

这是 jQuery 为我们供应的又一个轻易而壮大的功用,它的内部完成一定很有意义!

编译自:CSS-Tricks

    原文作者:哈哈胡子
    原文地址: https://segmentfault.com/a/1190000000339421
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞