7
votes

Arrêtez la mouseleave lorsque vous avez cliqué sur un objet

Si je veux mouseener un div, un élément montrera, puis lorsque la mouseleave disparaît.

J'ai une fonction de clic à l'intérieur de la souriseuse, alors il y a un menu déroulant lorsque vous avez cliqué sur. p>

Je souhaite le menu déroulant et l'élément de rester actif, même lorsque des souris de souris. Je veux donc que les mouseleaves ne soient pas applicables dans cette situation, lorsqu'il y a un événement de clic. L'utilisateur devra cliquer à nouveau sur l'élément ou n'importe où sur la page pour faire disparaître l'élément et DropdownMenu. P>

mais je veux garder la fonction de mousse à Mouseleave, donc si vous utilisez un DIV, l'élément montrera et ils peut cliquer dessus à nouveau. P>

J'ai actuellement quelque chose comme ça, mais je ne sais tout simplement pas comment faire de la mousse à ne pas être applicable lorsque vous cliquez sur P>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class='div'>
       <div class='element' style='display:none;'>
          boxed element
       </div>
       <div class='dropdown' style='display:none;'>
          menu
       </div>
    </div>

jquery function mouseevent click

2 commentaires

Je sens que ce n'est pas une bonne approche ..

s'il vous plaît un morceau de code HTML

5 Réponses :

0
votes

Vous pouvez utiliser les nouvelles méthodes d'activation / désactivation de JQuery pour cela si vous utilisez 1,7+

quelque chose comme: xxx

violon: http://jsfiddle.net/fsjtm/

aura probablement besoin de quelques touches, mais cela vous donnera une idée générale.

0 commentaires

4
votes

Vous pouvez définir un attribut personnalisé pour marquer l'élément comme cliqué. Le gestionnaire d'événements de Mouseleave peut vérifier la valeur de cet attribut personnalisé avant de cacher l'élément.

I.e. Quelque chose comme: xxx

0 commentaires

6
votes

Cela a fait le tour pour moi xxx

1 commentaires

C'est une approche très simple et intuitive pour résoudre ce problème.

0
votes

utiliser event.stoppropagation ();

Ceci est meilleur, car vous pouvez utiliser des liens sur élément p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class='div'>HERE
   <div class='element'>
      boxed element
   </div>
   <div class='dropdown'>
      menu
   </div>
</div>

0 commentaires

0
votes

Il semble que l'événement Mouseleave que vous vous référez, est déclenché sur mesure par le clic JQuery et non un sourire de souris original. Essayez ceci: xxx

0 commentaires