我正试图只触发一次事件监听器回调。 addEventListener
方便地有一个标志,我可以传递给它:
once:一个布尔值,表示在添加后最多应调用一次监听器。如果为true,则在调用侦听器时将自动将其删除。
除了 IE11和Edge之外,这在每个浏览器中都很棒。我知道我可以在它触发后手动删除事件监听器,但是这个标志应该工作......我做错了什么,或者这是IE的公认问题还是什么?
Should you prefer JSFiddle,否则:
var div = document.getElementById('transition');
var result = document.getElementById('result');
window.grow = function(){
var width = div.offsetWidth + 50;
div.style.width = width + 'px';
}
var count = 0;
div.addEventListener('transitionend', function(){
result.innerHTML = "transitionend has fired " + ++count + " times";
}, { once: true });
#transition{
background-color: yellow;
transition: width 2s;
width: 100px;
}
<div id="transition">
Content
</div>
<button onclick="grow()">
Grow the div
</button>
<div id="result">
</div>