JavaScriptで一回だけ実行させるeventをbindしたかったが、
jQueryのone
のようなメソッドがなかったので同様の処理を行うaddEventListenerOnce
を実装した。
addEventListener
のoptionsパラメータが使用できるブラウザなどでは、
onceパラメータを使用する。
https://developer.mozilla.org/ja/docs/Web/API/EventTarget/addEventListener
addEventListener('click', () => {
// 処理
}, { once: true});
addEventListener
のoptionsパラメータが使用できない場合は、
下記コードを参照。
Code(ES6)
const addEventListenerOnce = (target, type, listener) => {
target.addEventListener(type, function fn() {
target.removeEventListener(type, fn);
listener();
});
};
const element = document.getElementById('sample');
addEventListenerOnce(element, 'click', () => {
// 処理...
});
Code
var addEventListenerOnce = function(target, type, listener) {
target.addEventListener(type, function fn() {
target.removeEventListener(type, fn);
listener();
});
};
var element = document.getElementById('sample');
addEventListenerOnce(element, 'click', function() {
// 処理...
});