jQuery Girl
  1. jQuery Girl
  3. Comment puis-je faire un bouton en attente pour deux secondes appel function1 si moins de deux secondes appel function2?
Intereting Posts
Comment supprimer / basculer la classe de survol sur un élément (traduit au clic) sans avoir à déplacer la souris à nouveau? Vérifiez si tous les éléments satisfont à une condition Le succès de jQuery AJAX ne fonctionne pas dans Firefox Jquery recherche en utilisant la saisie en temps réel, comme l’option de filtre dans Angular JS jquery ajax call – retourne une valeur si dataType est simplement un texte (chaîne) JQuery.getJSON peut-il mettre les cookies d’un domaine dans l’en-tête de la demande qu’il fait? Charger DOM avant css? JQuery – Obtenir l’heure au format HH: MM entre deux dates Mise à jour du DOM après insertion dans jQuery Comment envoyer un tableau de tableaux sous forme de données dans $ .ajax ()? Événement Keyup JQuery non déclenché Ajouter une classe et supprimer une classe en fonction de la radio cochée? Jquery bascule Inclut une erreur dans IE8,9,10 Sélecteur jQuery pour un élément MISSING d’un élément enfant Howler.js – référence et déclenchement de fichiers à partir d’un tableau / pour une boucle

Comment puis-je faire un bouton en attente pour deux secondes appel function1 si moins de deux secondes appel function2?

J’ai ce bouton qui ne fonctionne pas correctement pour le bouton de maintien pendant une période (mais cela fonctionne comme un clic seulement).

Où j’essayais de faire si le bouton est hold pendant plus de 2 secondes, puis callfunction1 , si le bouton est enfoncé moins de 2 secondes, alors callfuntion2 . 

 var clickDisabled = false; function clickLocker() { /* @Button: 2 seconds */ clickDisabled = true; setTimeout(function(){clickDisabled = false;}, 2000); } function callfunction1() { // you have hold he button for greater then or equal 2 second } function callfunction2() { // you have hold the button less then 2 second } $('.button').live("click",function() { if (clickDisabled) { alert("locked for 2 second"); return; } clickLocker(); });

C’était une excellente suggestion de slash. Voici comment tu peux faire ça 

 var clickstart; var clickstop; $("a").on('mousedown', function(e) { clickstart = e.timeStamp; }).on('mouseup', function(e) { clickstop = e.timeStamp- clickstart if(clickstop >= 2000) two() else one(); });

Démo

Mises à jour:

Il sera peut-être nécessaire de suivre le mouvement de la souris comme l’a écrit @MarkRhodes dans ses commentaires. Donc, pour cela, vérifiez cette mise à jour

Écoutez les deux événements, mousedown et mouseup, en mesurant le temps entre les deux: 

  var timeDown; var timeUp; $('.button').live("mousedown",function(){ timeDown = event.timeStamp; }); $('.button').live("mouseup",function(){ timeUp = event.timeStamp; time = timeUp-timeDown; if (time>2000){ function1(); }else{ function2(); } });

veuillez noter que event.timeStamp ne fonctionnera pas bien dans Firefox. Pour Firefox, vous pouvez faire (nouvelle Date) .getTime ();

Je pense que cette solution devrait fonctionner. Je ne l’ai pas testé mais cela devrait vous donner la bonne idée. 

 var startTime; function callfunction1() { // you have hold he button for greater then or equal 2 second } function callfunction2() { // you have hold the button less then 2 second } function buttonDownEvent() { var Time = new Date(); startTime = Time.getTime(); } function buttonUpEvent() { if(new Date().getTime() - startTime < 2000) callfunction2() else callfunction1() } $('.button').live("mousedown",function() { buttonDownEvent(); }); $('.button').live("mouseup",function() { buttonUpEvent(); });

Vous pouvez le faire en utilisant des événements pour les événements MousUp et Mousedown et en chronométrant la différence entre eux. En outre, vous devez vous rappeler quel élément a provoqué le déclic. Si l’utilisateur a relâché la souris sur un élément différent, il doit alors effectuer la fonction “non maintenu pendant 2 secondes”. Un JSFiddle montrant ce travail est disponible ici: http://jsfiddle.net/35rw3/6/ .