Maison > interface Web > js tutoriel > Comment puis-je supprimer en toute sécurité les écouteurs d'événements JavaScript dans leurs propres gestionnaires ?

Comment puis-je supprimer en toute sécurité les écouteurs d'événements JavaScript dans leurs propres gestionnaires ?

Barbara Streisand
Libérer: 2024-12-07 14:51:12
original
590 Les gens l'ont consulté

How Can I Safely Remove JavaScript Event Listeners Inside Their Own Handlers?

Suppression des écouteurs d'événements JavaScript dans les gestionnaires d'événements

En JavaScript, la suppression d'un écouteur d'événements dans la définition du même gestionnaire d'événements peut poser des problèmes. Pour résoudre ce problème, envisagez les stratégies suivantes :

Utilisation de fonctions nommées

Une approche consiste à utiliser des fonctions nommées :

var click_count = 0;

function myClick(event) {
    click_count++;
    if (click_count == 50) {
        // to remove
        canvas.removeEventListener('click', myClick);
    }
}

// to add
canvas.addEventListener('click', myClick);
Copier après la connexion

Fermeture avec gestion indirecte des événements

Alternativement, vous pouvez clôturer via le compteur de clics en utilisant une gestion indirecte des événements pattern :

var myClick = (function (click_count) {
    var handler = function (event) {
        click_count++;
        if (click_count == 50) {
            // to remove
            canvas.removeEventListener('click', handler);
        }
    };
    return handler;
})(0);

// to add
canvas.addEventListener('click', myClick);
Copier après la connexion

Utiliser un générateur de fonctions

Si vous avez besoin que chaque élément ait son propre compteur, vous pouvez utiliser un générateur de fonctions :

var myClick = function (click_count) {
    var handler = function (event) {
        click_count++;
        if (click_count == 50) {
            // to remove
            canvas.removeEventListener('click', handler);
        }
    };
    return handler;
};

// to add
canvas.addEventListener('click', myClick(0));
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal