J'ai implémenté un menu déroulant personnalisé avec HTML, CSS et JavaScript. Cela fonctionne bien maintenant, mais je ne suis pas content de la façon dont je fais le "flou" en ce moment. Lorsque vous ouvrez la liste, puis cliquez ailleurs, il devrait s'effondrer. Ce que j'ai fait, c'est que j'ai ajouté un écouteur d'événement (mousedown
) au window
après avoir développé la liste et supprimé l'écouteur après l'effondrement. L'événement vérifie essentiellement si l'événement DOM s'est produit sur l'élément de droite en utilisant target
et si ce n'est pas le cas, flouter le contrôle déroulant. Je connais focus
et blur
. Cependant, ils semblent seulement fonctionner sur des éléments de forme, ce que je trouve tout à fait compréhensible. Ils prennent également en charge d'autres scénarios comme lorsque "tabbing" loin.Focus et brouiller les événements pour HTMLDivElement?
De toute façon, je vous demande s'il y a une meilleure façon de faire ce que je fais en ce moment. Ce que je fais me sent juste stupide.
Le seul problème est que si vous cliquez sur la liste déroulante réelle, il va flouter l'entrée et penser qu'il devrait réduire le menu déroulant. Ou voulez-vous dire que je configure un écouteur de clic à cette liste déroulante qui empêcheDefault()? – Tower
Yah c'est vrai. Vous aurez probablement besoin de voir si la cible du flou est le contrôle lui-même, et ne pas arrêter l'événement. –