Ne déclenchez un événement qu'une seule fois?

Question

Comment contrôler uniquement le déclenchement d'un événement une fois?

En fait, un rapide Google semble faire allusion au fait que .one aide ..

Answer 1

Vous pouvez utiliser jQuery de one method, qui souscrira seulement la première occurrence d'un événement.
Par exemple:

$('something').one('click', function(e) { 
    alert('You will only see this once.'); 
}); 

Answer 2

vanille js

function addEventListenerOnce(target, type, listener) { 
    target.addEventListener(type, function fn(event) { 
     target.removeEventListener(type, fn); 
     listener(event); 
    }); 
} 

addEventListenerOnce(document.getElementById("myelement"), "click", function (event) { 
    alert("You'll only see this once!"); 
}); 

http://www.sitepoint.com/create-one-time-events-javascript/

Edit: modification inspirée par la version de la lingue et la terminologie de https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

Modifier 23/11/2016:

once vient aux navigateurs. Actuellement Chrome 55, Firefox 50, Safari 10,1

• http://caniuse.com/#feat=once-event-listener
• https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Parameters

Et vous l'utilisez comme ceci:

document.addEventListener(
    'DOMContentLoaded', 
    improveAllTheThings, 
    {once: true} 
); 

https://www.webreflection.co.uk/blog/2016/04/17/new-dom4-standards

Answer 3

Identique à la réponse de rofrol , juste une autre forme:

function addEventListenerOnce(element, event, fn) { 
     var func = function() { 
      element.removeEventListener(event, func); 
      fn(); 
     }; 
     element.addEventListener(event, func); 
    } 

Answer 4

De plus, vous pouvez le faire:

window.addEventListener("click", function handleClick(e) { 
    window.removeEventListener("click", handleClick); 

    // ... 
}); 

Answer 5

Ajouté les options pour ajouter/supprimer écouteur d'événement:

function addEventListenerOnce(target, type, listener, optionsOrUseCaptureForAdd, optionsOrUseCaptureForRemove) { 
    const f = event => { 
     target.removeEventListener(type, f, optionsOrUseCaptureForRemove); 
     listener(event); 
    } 
    target.addEventListener(type, f, optionsOrUseCaptureForAdd); 
} 

Answer 6

Il suffit d'utiliser l'option appropriée dans votre méthode addEventListener appel:

element.addEventListener(event, func, { once: true })