J'ai basculé sur l'événement Cliquez sur un nœud et je souhaite également basculer un événement DBClick également. Cependant, il déclenche uniquement l'événement de clic lorsque je dbcliquez dessus. P>
Alors, comment puis-je définir les deux événements en même temps? P>
5 Réponses :
$("#test").bind({ dblclick: function(){alert("Hii")}, mousedown: function(){alert("hello")} });
Comment lier différentes fonctions à ces deux événements?
Donc, vous voulez une deux fonctions distinctes. Un pour un seul clic et un autre pour double clic?
Vous devriez probablement faire un double-clic personnalisé, car il est en pratique impossible de détecter si un clic était un double-clique de manière nativement, comme un double clic est composé de deux clics. Utilisez simplement une fonction où vous vérifiez si l'utilisateur clique deux fois dans une certitude la durée.
@Swaropnagendra Le DBLCLICK n'a aucun effet dans votre exemple. L'alerte apparaît au premier clic.
Oui il a raison. Le seul moyen d'atteindre DBLCLICK est à deux clics simples. Je ne sais pas que c'est possible ou pas
Il est possible en définissant un délai d'attente. Ma réponse ci-dessous.
Vous devez faire votre "propre" détection de doubleclick
quelque chose comme ça pourrait fonctionner: p> voici un travail JSFIDDLE P> Pour plus d'informations sur le délai que vous devez utiliser pour votre minuterie, consultez ici: Comment utiliser à la fois onclick et Ondblclick sur un élément? A > p> p>
Je pense que nous devrions faire quelque chose comme ceci: attendez la fonction de clic. Si rien ne se passe pendant une seconde ou plus après la fonction de clic, alerte ("simple clic"). Ou s'il y a un autre événement de clic en une seconde après le premier clic, alors alerter ("dbl click"). Qu'est-ce que tu penses?
C'est ce que je fais. Mais le retard que j'ai mis est peut-être trop petit. Essayez de jouer avec cela, si vous voulez avoir connu avec Click / DoubleClick sans avoir à cliquer sur Crazy. :RÉ
Grande solution. Cependant, y a-t-il un moyen de passer un paramètre sur le rappel du délai d'attente?
Je l'ai trouvé moi-même. Voici le Solution à ma question
@Solesschong, ma solution était proche. Vous n'avez pas spécifié dans votre question que vous aviez besoin d'un paramètre pour le rappel. J'ai édité ma réponse pour prendre cela en compte.
@Jeremyd Oui, votre solution était parfaite pour ma question et c'était un suivi.
Vous devez suivre le double clic et si ce n'est pas un double clic exécutant, cliquez sur Action.
Essayez ceci
J'ai à peu près utilisé la même logique que Jeremy D.
Cependant, dans mon cas, il était plus propre de résoudre cette chose avec des fonctions anonymes et un délai de double clic mineur: P>
dblclick_timer = false .on("click", function(d) { // if double click timer is active, this click is the double click if ( dblclick_timer ) { clearTimeout(dblclick_timer) dblclick_timer = false // double click code code comes here console.log("double click fired") } // otherwise, what to do after single click (double click has timed out) else dblclick_timer = setTimeout( function(){ dblclick_timer = false // single click code code comes here console.log("single click fired") }, 250) })
Une approche légèrement différente - La comparaison de clic réelle se produit plus tard dans la fonction Timeout, après un intervalle prédéfini ... jusqu'à ce que nous gardons simplement l'onglet sur les drapeaux.
& avec quelques modifications simples (compteur de clic au lieu de drapeaux), il peut également être étendu à n'importe quel nombre de clics successifs rapides (Triple Click, et al), limité par la praticité. P>
var clicked = false, dblClicked = false, clickTimer; function onClick(param){ console.log('Node clicked. param - ',param); }; function onDoubleClick(param){ console.log('Node Double clicked. param - ',param); }; function clickCheck(param){ if (!clicked){ clicked = true; clickTimer = setTimeout(function(){ if(dblClicked){ onDoubleClick(param); } else if(clicked){ onClick(param); } clicked = false; dblClicked = false; clearTimeout(clickTimer); },150); } else { dblClicked = true; } };