JavaScript只允许用户点击一次

Question

我需要将其转换为vanilla JavaScript,只允许用户点击一次并防止在Google Analytics中记录多次点击.

jQuery的

$('.test-link').one("click", function() {
    $(this).click(function() {
        return false;
    });
});

<a class="test" data-label="track-this-link">Click</a>

我不能使用jQuery,所以任何帮助都会很棒!谢谢.

Answer 1

在现代浏览器中,addEventListener接受一个options可以包含once属性的对象- 如果设置为true,则侦听器将只触发一次,之后将自动删除:

document.querySelector('.test').addEventListener(
  'click',
  () => {
    console.log('listener running');
    return false;
  },
  { once: true }
);

<a class="test" data-label="track-this-link">Click</a>

没有once,请手动执行removeEventListener:

const test = document.querySelector('.test');
function listener() {
  console.log('listener running');
  test.removeEventListener('click', listener);
  return false;
}
test.addEventListener('click', listener);

<a class="test" data-label="track-this-link">Click</a>