2010-08-03 103 views
15

如何控制只發射一次事件?只發一次事件?

事實上,一個快速谷歌似乎暗示這一事實。一是有助於..

+2

只要我的代表超過3000我要去c將'逃避'改爲'暗示' – 2013-07-26 05:28:50

+0

哦,我的確是很尷尬。感謝那。 – Qcom 2013-07-26 17:25:53

+0

很高興我的評論提請你注意 – 2013-07-26 19:10:54

回答

14

您可以使用jQuery的one method,這將認購僅一個事件的第一次出現。
例如:

$('something').one('click', function(e) { 
    alert('You will only see this once.'); 
}); 
+0

好吧,真棒,只是想知道,括號之間的'e'是什麼? 此外,此功能是否需要兩個參數? 1爲你想只運行一次,另一個爲功能? – Qcom 2010-08-03 05:04:25

+1

'e'是回調的事件形式參數。在這種情況下,它是未使用的。這兩個參數是事件類型和函數。 – 2010-08-03 05:05:52

+0

太棒了!這真的很有幫助,這和.bind有什麼區別?難道它不需要被.unbind之類的東西解除綁定嗎? – Qcom 2010-08-03 05:07:04

20

香草JS

function addEventListenerOnce(target, type, listener) { 
    target.addEventListener(type, function fn(event) { 
     target.removeEventListener(type, fn); 
     listener(event); 
    }); 
} 

addEventListenerOnce(document.getElementById("myelement"), "click", function (event) { 
    alert("You'll only see this once!"); 
}); 

http://www.sitepoint.com/create-one-time-events-javascript/

編輯:修改從https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

編輯2016年11月23日由菱的版本和術語啓發:

once即將推出瀏覽器。目前在Chrome 55,Firefox的50,Safari瀏覽器10.1

並且你使用這樣的:

document.addEventListener(
    'DOMContentLoaded', 
    improveAllTheThings, 
    {once: true} 
); 

https://www.webreflection.co.uk/blog/2016/04/17/new-dom4-standards

3

同rofrol的答案,只是另一種形式:

function addEventListenerOnce(element, event, fn) { 
     var func = function() { 
      element.removeEventListener(event, func); 
      fn(); 
     }; 
     element.addEventListener(event, func); 
    } 
0

此外,你可以這樣做:爲附加

window.addEventListener("click", function handleClick(e) { 
    window.removeEventListener("click", handleClick); 

    // ... 
}); 
0

添加選項/刪除事件偵聽器:

function addEventListenerOnce(target, type, listener, optionsOrUseCaptureForAdd, optionsOrUseCaptureForRemove) { 
    const f = event => { 
     target.removeEventListener(type, f, optionsOrUseCaptureForRemove); 
     listener(event); 
    } 
    target.addEventListener(type, f, optionsOrUseCaptureForAdd); 
} 
2

只要使用正確的選項,你的addEventListener方法調用:

element.addEventListener(event, func, { once: true }) 
+0

不支持IE。 – 2018-02-13 19:37:54