Utilisez l'anti-shake pour faire disparaître DIV lorsque la souris est déplacée
Étant donné que la balise div elle-même ne prend pas en charge l'événement onblur, pour un div qui apparaît lorsqu'un bouton est cliqué, nous voulons le faire disparaître lorsque le div perd le focus et ne peut pas être obtenu en utilisant onblur.
Mais vous pouvez utiliser onmouseout et les événements pour réaliser la fonction de perte de focus et de disparition de DIV. Il peut y avoir un problème avec l'utilisation directe de onmouseout pour réaliser la suppression et la disparition : si la position de votre bouton et la position du div pop-up ne coïncident pas, l'événement onmouseout sera déclenché immédiatement lorsque la souris bouge, ce qui est inutile.
Utilisez la combinaison d'anti-shake, onmouseout et onmouseover pour obtenir un événement flou avec une bonne expérience
/** *La souris se déplace sur l'événement div*/ function moveOverEvent(ele,outTimer) { let overTimer = null; return function(){ clearTimeout(outTimer); //Si le div ne disparaît pas, déplacez le div, puis Effacez le dernier événement supprimé clearTimeout(overTimer); //Anti-shake overTimer = setTimeout(()=>{ ele.style.display = block; },500 } } /** *); La souris sort*/ function moveOutEvent(ele,outTimer) { return function(){ clearTimeout(outTimer); //Anti-shake outTimer = setTimeout(()=>{ //Attendez 500 ms après le déplacement, puis faites disparaître cet élément div .style .display = aucun },500);
Ensuite, j'ai accidentellement découvert que l'événement flou pouvait être implémenté en ajoutant l'attribut tabindex au div, donc le code ci-dessus a peut-être été écrit en vain. (PS, je pense que l'expérience ci-dessus sera meilleure et réduira beaucoup de contacts accidentels)
//Une fois tabindex défini, l'élément ajoutera une ligne pointillée par défaut et la supprimera via ouline=0 (IE définit hidefocus=true) <div tabindex=0 outline=0 hidefocus=true></div>
Ce qui précède représente l’intégralité du contenu de cet article. J’espère qu’il sera utile à l’étude de chacun. J’espère également que tout le monde soutiendra le réseau VeVb Wulin.