jQuery 事件的命名空間

suemi 發布于2019-08-19 14:23 / 3300人閱讀

摘要：但是如果你不知道這個函數的名字，或者你用的是匿名函數怎樣才能精確地解綁某一個事件監聽器呢該了解一下的事件命名空間了先上代碼這里不只是把事件作為參數傳入方法，而是給事件指定了一個命名空間，然后監聽了這個命名空間里的事件。

用 jQuery 綁定和解綁事件監聽器都是非常簡單的。但是當你為一個元素的一個事件綁定了多個監聽器時，怎樣精確地解綁其中一個監聽器？我們需要了解一下事件的命名空間。

看下面這段代碼：

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

像上面這樣綁定事件監聽器，當元素被點擊時，doSomething 和 doSomethingElse 這兩個監聽器都會被觸發。這是使用 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

云服務器 GPU云服務器 jquery的事件處理 webrtc的命名空間 js里的命名空間 c語言的命名空間

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/77952.html

jQuery (二)

摘要：文件命名需要使用的庫該庫已經兩年未更新了，不過依舊在回復中，對于庫的檢查，已經完全測試通過一個栗子，日期選擇將為中的元素統統替換為日期選擇組件使用jQuery處理事件事件處理一個栗子，單擊p時背景變成灰色由于es6的箭頭函數不支持this的綁定，所以無法使用箭頭函數，只能使用匿名函數 html hello world js // 單擊...

asoren 2019-08-23 11:28 評論0 收藏0
jQuery擴展

摘要：傳遞一個可拓展的默認對象參數而不是大量的參數給插件。始終命名空間的方法，事件和數據。 jq--CDN jQ -- jQuery源碼解析 1、jQuery.extend() 與 jQuery.fn.extend()把jQuery看成一個封裝js類這樣好理解$.extend是擴展的jQuery這個類為jQuery類添加類方法可以理解為靜態方法只跟這個類本身有關跟具體的實例化對象是...

hss01248 2019-08-26 13:35 評論0 收藏0
jQuery之事件綁定到觸發全過程及知識點補充

摘要：十的觸發機制被點擊了元素本身綁定了一個事件，但是是原生事件，它是靠綁定來觸發事件的。 showImg(https://segmentfault.com/img/remote/1460000019505402); 前言：最重要的還是最后的流程圖，可以試著根據流程圖手寫實現$().on()，下篇文章會放出模擬實現的代碼。一、舉例這是A 這是C ...

Jioby 2019-08-23 18:10 評論0 收藏0
jQuery源碼學習之event

摘要：回調隊列中的元素是對象，代表一個事件回調，擁有多個屬性，如等等，其中是回調函數，在觸發時通過傳遞，具體的在后面講。類型是時鍵表示事件名，規則同上，鍵值表示事件觸發時的回調函數。 jQuery源碼學習之event jQuery的事件機制為異步回調，事件監聽的屬性、參數和回調的等保存在Data實例中，在元素上保存該對象的引用。有方法handle，內部執行dispatch；有屬性events...

XboxYan 2019-08-26 12:11 評論0 收藏0