当您使用addEventListener()
方法将事件处理程序添加到元素的事件时,事件处理程序将在每次事件发生时执行。
要创建一个仅执行一次的一次性事件处理程序,请使用addEventListener()
方法的第三个参数。
element.addEventListener(type,handler,{once: true});
Code language: CSS (css)
addEventListener()
方法的第三个参数是一个对象,它具有一个属性once
。如果将其设置为true
,则事件处理程序将仅执行一次。
以下示例显示了如何创建一个一次性事件处理程序。假设您有一个带有类.btn
的按钮。
<button class="btn">Subscribe</button>
Code language: HTML, XML (xml)
以下将一次性事件处理程序添加到按钮的点击事件
const btn = document.querySelector('.btn');
btn.addEventListener('click', function (e) {
alert('Subscribed!');
}, {
once: true
});
Code language: JavaScript (javascript)
如果您单击按钮,它将只显示一次alert
对话框。
本教程是否有帮助?