資訊專欄INFORMATION COLUMN
摘要：但是如果你不知道這個函數(shù)的名字，或者你用的是匿名函數(shù)怎樣才能精確地解綁某一個事件監(jiān)聽器呢該了解一下的事件命名空間了先上代碼這里不只是把事件作為參數(shù)傳入方法，而是給事件指定了一個命名空間，然后監(jiān)聽了這個命名空間里的事件。
用 jQuery 綁定和解綁事件監(jiān)聽器都是非常簡單的。但是當(dāng)你為一個元素的一個事件綁定了多個監(jiān)聽器時(shí)，怎樣精確地解綁其中一個監(jiān)聽器？我們需要了解一下事件的命名空間。
看下面這段代碼：
$(“#element”)
.on(“click”, doSomething)
.on(“click”, doSomethingElse);
像上面這樣綁定事件監(jiān)聽器，當(dāng)元素被點(diǎn)擊時(shí)，doSomething 和 doSomethingElse 這兩個監(jiān)聽器都會被觸發(fā)。這是使用 jQuery 的一個便利之處，可以隨時(shí)給元素的同一個事件添加不同的監(jiān)聽器。不像用 onclick 那樣，新的監(jiān)聽器會覆蓋舊的。
如果你想解綁其中一個監(jiān)聽器，比如 doSomething，怎么做呢？
是這樣嗎？
$(“#element”).off(“click”);
注意！上面這行代碼會把元素的 click 事件的所有監(jiān)聽器全部解綁，而這并不是我們要的結(jié)果。
幸運(yùn)的是 jQuery 的 .off() 方法可以接受第二個參數(shù)，就像 .on() 一樣。只要把監(jiān)聽器函數(shù)的名字作為第二個參數(shù)傳入 .off() 方法，就能夠解綁指定的監(jiān)聽器。
$(“#element”).off(“click”, doSomething);
但是如果你不知道這個函數(shù)的名字，或者你用的是匿名函數(shù)：
$(“#element”)
.on(“click”, function() {
console.log(“doSomething”);
});
怎樣才能精確地解綁某一個 click 事件監(jiān)聽器呢？該了解一下 jQuery 的事件命名空間了！
先上代碼：
$(“#element”)
.on(“click.myNamespace”, function() {
console.log(“doSomething”);
});
這里不只是把 click 事件作為參數(shù)傳入 .on() 方法，而是給 click 事件指定了一個命名空間，然后監(jiān)聽了這個命名空間里的 click 事件。此時(shí)，即使監(jiān)聽器是匿名函數(shù)，實(shí)際上它也是“有名”的了?，F(xiàn)在你可以像下面這樣解綁某一個具體的命名空間里的事件監(jiān)聽器了。
$(“#element”).off(“click.myNamespace”);
這是 jQuery 為我們提供的又一個方便而強(qiáng)大的功能，它的內(nèi)部實(shí)現(xiàn)肯定很有意思！
編譯自：CSS-Tricks
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/77952.html
摘要：文件命名需要使用的庫該庫已經(jīng)兩年未更新了，不過依舊在回復(fù)中，對于庫的檢查，已經(jīng)完全測試通過一個栗子，日期選擇將為中的元素統(tǒng)統(tǒng)替換為日期選擇組件 使用jQuery處理事件 事件處理 一個栗子，單擊p時(shí)背景變成灰色 由于es6的箭頭函數(shù)不支持this的綁定，所以無法使用箭頭函數(shù)，只能使用匿名函數(shù) html hello world js // 單擊...
摘要：傳遞一個可拓展的默認(rèn)對象參數(shù)而不是大量的參數(shù)給插件。始終命名空間的方法，事件和數(shù)據(jù)。 jq--CDN jQ -- jQuery源碼解析 1、jQuery.extend() 與 jQuery.fn.extend()把jQuery看成一個封裝js類 這樣好理解$.extend是擴(kuò)展的jQuery這個類 為jQuery類添加類方法 可以理解為靜態(tài)方法 只跟這個類本身有關(guān) 跟具體的實(shí)例化對象是...
摘要：十的觸發(fā)機(jī)制被點(diǎn)擊了元素本身綁定了一個事件，但是是原生事件，它是靠綁定來觸發(fā)事件的。 showImg(https://segmentfault.com/img/remote/1460000019505402); 前言：最重要的還是最后的流程圖，可以試著根據(jù)流程圖手寫實(shí)現(xiàn)$().on()，下篇文章會放出模擬實(shí)現(xiàn)的代碼。 一、舉例 這是A 這是C ...
摘要：回調(diào)隊(duì)列中的元素是對象，代表一個事件回調(diào)，擁有多個屬性，如等等，其中是回調(diào)函數(shù)，在觸發(fā)時(shí)通過傳遞，具體的在后面講。類型是時(shí)鍵表示事件名，規(guī)則同上，鍵值表示事件觸發(fā)時(shí)的回調(diào)函數(shù)。 jQuery源碼學(xué)習(xí)之event jQuery的事件機(jī)制為異步回調(diào)，事件監(jiān)聽的屬性、參數(shù)和回調(diào)的等保存在Data實(shí)例中，在元素上保存該對象的引用。有方法handle，內(nèi)部執(zhí)行dispatch；有屬性events...
閱讀 2701·2021-11-25 09:43
閱讀 2789·2021-11-04 16:09
閱讀 1780·2021-10-12 10:13
閱讀 932·2021-09-29 09:35
閱讀 937·2021-08-03 14:03
閱讀 1828·2019-08-30 15:55
閱讀 3062·2019-08-28 18:14
閱讀 3651·2019-08-26 13:43
