Comment puis-je transmettre des arguments à une fonction addEventListener ?

Comment transmettre des arguments aux fonctions d'écoute addEventListener

Dans un scénario où nous souhaitons transmettre des arguments à une fonction d'écoute d'événement, nous pourrions rencontrer une situation où l'argument est inaccessible au sein de la fonction. Cela peut se produire lorsque nous attribuons une variable à la fonction, comme ceci :

var someVar = some_other_function();
someObj.addEventListener("click", function(){
    some_function(someVar);
}, false);

Ici, le problème est que la valeur de someVar n'est pas disponible dans la fonction de l'écouteur d'événement.

A Meilleure approche : utilisation du paramètre de la cible de l'événement

Pour résoudre ce problème, nous pouvons exploiter l'attribut target de l'objet événement pour récupérer les paramètres transmis à la fonction d'écoute. Prenons cet exemple :

const someInput = document.querySelector('button');
someInput.addEventListener('click', myFunc, false);
someInput.myParam = 'This is my parameter';

function myFunc(evt)
{
    window.alert(evt.currentTarget.myParam);
}

Dans ce code modifié :

• Nous attribuons notre paramètre (« Ceci est mon paramètre ») à la propriété myParam de l'élément d'entrée.
• Notre fonction myFunc est définie en dehors de la portée de l'écouteur d'événement.
• Lorsque l'utilisateur clique sur l'élément d'entrée, myFunc La fonction est invoquée.
• Au sein de la fonction myFunc, nous pouvons accéder à notre paramètre via evt.currentTarget.myParam.

Cette approche nous permet effectivement de transmettre des arguments à notre fonction d'écoute d'événement sans rencontrer le problème d'origine.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!