Activate event handler only once in javascript-CodePudding

element.addEventListener('dblclick', function () {});

I believe there is a 'once' option but don't know where to put it?

CodePudding user response：

You are correct. The once option is specified in the optional options object parameter that can be passed in like so:

element.addEventListener('dblclick', function () {
    ...
}, { once: true });

Documentation: EventTarget.addEventListener#Syntax

CodePudding user response：

Since once has limited support in some browsers I use this method, which is a nice pattern in javascript anyway.

function addEventListenerOnce(elem, name, callback) {
  var foo = function(ev) {
    elem.removeEventListener(name, foo);
    callback.call(elem, ev)
  }
  elem.addEventListener(name, foo)
}

var elem = document.querySelector("button");
addEventListenerOnce(elem, 'click', () => console.log("click"))

<button>click</button>