JS等效于jQuery one()

Question

有人能指出我的解决方案吗？我正在尝试为这个jQuery代码找到一个JS等价物:

var formSelector = 'my selector here';
var attribute = 'name';
var formHistory = [];

$(formSelector).one('focusout', function(e) {
    formHistory.push(e['target'].getAttribute(attribute));
});

Answer 1

在eventlistener回调中,只需破坏事件监听器:)这是一个辅助函数:

document.getElementById('btn').addEventListener('click', () => {
  console.log('Hello and goodbye');
}, {
  once: true,
});

<button id="btn">Click me</button>

Answer 2

这是一个使用数据属性的非常简单的解决方案.

document.querySelector('#click').addEventListener('click', function(e){
    if(e.currentTarget.dataset.triggered) return;
    e.currentTarget.dataset.triggered = true;
    alert('clicked');
})

<button id="click">Click me</button>

Answer 3

您可以once: true在options传递给的参数中使用addEventListener()。

浏览器支持：不支持Chrome 55 +，Firefox 50 +，Safari 10，Edge 16，IE。

document.getElementById('foo').addEventListener('click', function(e) {
  alert('This will be displayed only once.');
}, { once: true });

<button id="foo">Click me</button>

参考：

• 从前事件监听器
• 我可以使用...“一次”事件侦听器选项