Comment gérer efficacement les événements de redimensionnement avec la gestion des événements retardés ?

Gestion retardée des événements pour l'événement de redimensionnement

Lors de la gestion de l'événement de redimensionnement en JavaScript, il est courant de rencontrer plusieurs appels pendant le processus de redimensionnement. Cela peut entraîner des problèmes de performances ou un comportement indésirable. Pour résoudre ce problème, envisagez d'utiliser une approche de gestion des événements retardés.

Utilisation de setTimeout() et clearTimeout()

Une solution efficace consiste à utiliser setTimeout() et clearTimeout () fonctions. Voici comment cela fonctionne :

function resizedw() {
    // Haven't resized in 100ms!
}

var doit;
window.onresize = function() {
    clearTimeout(doit);
    doit = setTimeout(resizedw, 100);
};

Dans cette solution :

• La fonction resizedw est invoquée uniquement après qu'il n'y ait eu aucun événement de redimensionnement pendant le délai spécifié (dans ce cas, 100 millisecondes).
• clearTimeout() est utilisé pour annuler toute invocation resizew en attente déclenchée par des événements de redimensionnement précédents.
• setTimeout() planifie une nouvelle invocation resizew après le délai, garantissant qu'elle ne se produit qu'une seule fois. après l'événement de redimensionnement final.

Cette approche vous permet de différer une action jusqu'à la fin de l'événement de redimensionnement, empêchant ainsi plusieurs exécutions.

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!