Consultez la formation SEO spéciale Wordpress
par WebRankInfo / Ranking Metrics

Messages: 460

Enregistré le: 3 Fév 2005

Message le Dim Mar 05, 2017 16:16

Bonjour, cela fait un moment que je ne trouve pas la solution. En effet je souhaite pouvoir stopper l'execution d'un script ajax après un clic sur le body.

Voici le code pour le clic :

Code: Tout sélectionner
$('body').on('click', 'a.close, #fade', function(){
    
   // COMMENT ARRETER LE CODE SUIVANT APRES LE CLIC ??
})


Code suivant à stopper après le clic :

Code: Tout sélectionner
$(document).ready(function() {

   $('#wait').fadeIn(500);
   $('#run').fadeOut(500, function(){

      var counter = 0;
      
      var looper = setInterval(function(){
         
         $.ajax({
url: '?mod=ssh_connect',
timeout: 10000,
error: function(){
               response = 'Connection error. Retry please';
            },
success: function(data){            
               counter++;
               
               $('#wait').html(counter).fadeIn(500);
               $('#run').html(data).fadeIn(500);
               
               if (counter >= 5)
               {
                      clearInterval(looper);
               }
            }
         });
         
      }, 10000);
   });   
   
   return false;
});


Merci
Haut
13 Réponses
Messages: 12290

Enregistré le: 23 Nov 2005

Message le Dim Mar 05, 2017 16:50

Créer un cookie en JS et conditionner le lancement à la présence ou nom de ce cookie.
Haut
Messages: 460

Enregistré le: 3 Fév 2005

Message le Dim Mar 05, 2017 16:59

C'est pas très propre cette solution, c'est pas possible comme je le souhaite ?
Haut
Messages: 12290

Enregistré le: 23 Nov 2005

Message le Dim Mar 05, 2017 17:06

sff a écrit:C'est pas très propre cette solution


Je vois pas bien ce qu'elle a de pas propre cette solution. Imaginons que l'utilisateur refresh sa page, ta solution n'empêchera pas que le script ajax se relance, la mienne si.
Haut
Messages: 460

Enregistré le: 3 Fév 2005

Message le Dim Mar 05, 2017 17:21

Si l'utilisateur rafraichi sa page, le script d'arrete forcement. Pas besoin d'un cookie
Haut
Messages: 12290

Enregistré le: 23 Nov 2005

Message le Dim Mar 05, 2017 17:33

Si il recliquee après avoir refresh, ça relance le script. Mais ce n'est peut-être pas grave ?
Haut
Messages: 12290

Enregistré le: 23 Nov 2005

Message le Dim Mar 05, 2017 17:35

Après, il y a aussi moyen de jouer sur l'événement clic https://www.developpez.net/forums/d1101206/webmasters-developpement-we ... pres-clic/
Haut
Messages: 8559

Enregistré le: 14 Mai 2003

Message le Dim Mar 05, 2017 17:35

Tu lances le clearInterval(looper) dans l'event click.
Haut
Messages: 460

Enregistré le: 3 Fév 2005

Message le Dim Mar 05, 2017 17:45

J'ai egalement essayé ca il y a une dizaine d'heure. Oui ca fait plus de dix heure que je cherche une solution !

Mais rien ne fonctionne, j'ai tout essayé. La seule chose qui arrete l'execution du script c'est un alert js et ce n'est pas ce que je veux. Voici le code avec le clearInterval Spoot :

Code: Tout sélectionner
$(document).ready(function() {
   
   $('body').on('click', 'a.close, #fade', function(){

 clearInterval(looper);

}),

   $('#wait').fadeIn(500);
   $('#run').fadeOut(500, function(){
      
      var looper = setInterval(function(){
         
         $.ajax({
url: '?mod=ssh_connect',
timeout: 10000,
error: function(){
               response = 'Connection error. Retry please';
            },
success: function(data){            
               counter++;
               
               $('#wait').html(counter).fadeIn(500);
               $('#run').html(data).fadeIn(500);
               
               if (counter >= 5)
               {
                      clearInterval(looper);
               }
            }
         });
         
      }, 10000);
   });   
   
   return false;
});
Haut
Messages: 460

Enregistré le: 3 Fév 2005

Message le Dim Mar 05, 2017 18:03

Dans le script sur le counter >= 5 le setinerval s'arrete. Donc j'ai justement eu l'idée de renseigner counter = 500 après le clic sur le body et comme tout le reste cela ne fonctionne pas

Voici le code :

Code: Tout sélectionner
$(document).ready(function() {
   
   $('#wait').fadeIn(500);
   $('#run').fadeOut(500, function(){

      var counter = 0;
      
      var looper = setInterval(function(){   
         
         $.ajax({
url: '?mod=ssh_connect',
timeout: 10000,
error: function(){
               response = 'Connection error. Retry please';
            },
success: function(data){            
               counter++;
               
               $('#wait').html(counter).fadeIn(500);
               $('#run').html(data).fadeIn(500);
               
               if (counter >= 5)
               {
                      clearInterval(looper);
               }
            }
         });
         
      }, 10000);
   });   
   
$('body').on('click', 'a.close, #fade', function(){
   
   counter = 500; // Ne fonctionne pas !
   
});

});
Haut
Messages: 12290

Enregistré le: 23 Nov 2005

Message le Dim Mar 05, 2017 18:08

Code: Tout sélectionner
$('body').one('click', 'a.close, #fade', function(){


au lieu de

Code: Tout sélectionner
$('body').on('click', 'a.close, #fade', function(){


cf http://api.jquery.com/one/
Haut
Messages: 460

Enregistré le: 3 Fév 2005

Message le Dim Mar 05, 2017 18:15

Cela ne fonctionne toujours pas. Voici le code :

Code: Tout sélectionner
$(document).ready(function() {
   
   $('#wait').fadeIn(500);
   $('#run').fadeOut(500, function(){

      var counter = 0;
      
      var looper = setInterval(function(){   
         
         $.ajax({
url: '?mod=ssh_connect',
timeout: 10000,
error: function(){
               response = 'Connection error. Retry please';
            },
success: function(data){            
               counter++;
               
               $('#wait').html(counter).fadeIn(500);
               $('#run').html(data).fadeIn(500);
               
               if (counter >= 5)
               {
                      clearInterval(looper);
               }
            }
         });
         
      }, 10000);
   });   
   
$('body').one('click', 'a.close, #fade', function(){
   
   counter = 500; // Ne fonctionne pas !
   
});

});
Haut
Messages: 187

Enregistré le: 1 Oct 2014

Message le Lun Mar 06, 2017 10:46

ça serait bien d'en savoir plus sur ce que tu veux faire si c'est possible
Haut
Messages: 140

Enregistré le: 17 Oct 2009

Message le Lun Mar 06, 2017 11:34

Quand tu crée une requête ajax, tu dois avoir un objet en retour, que tu peux arrêter avec abort().
Une fois ta requete créée, tu ajoute un évenement sur body pour détecter le clic et stopper l'objet.

En Javascript ça donne une truc comme ça :
Code: Tout sélectionner
function AjaxInit(aMethod, aUrl){
   var o = new XMLHttpRequest();
   // tu peux utiliser l'API Fetch si tu veux être moderne : https://developer.mozilla.org/fr/docs/Web/API/Fetch_API
   o.onreadystatechange = function(){
      if(o.readyState == 4){
         // la requete est terminée
      }
   }
   o.open(aMethod, aUrl, true);
   // tu excecute la requete
   o.send();
   // tu renvois l'object XMLHttpRequest
   return o;
}
// la fonction qui stoppe l'exécution
function AjaxStop(aObj){
   aObj.abort();
}
// initialise l'objet
var ajaxObj = AjaxInit("GET", "https://www.adressedusite.fr/fichier.php");
// ajoute un événement clic sur body
document.body.addEventListener("click", function(){ AjaxStop(ajaxObj); }, false);

Voilà l'idée générale.
Haut

Formation recommandée sur ce thème :

Formation SEO spéciale Wordpress : apprenez à optimiser le référencement naturel d'un site fait avec Wordpress... Formation Ranking Metrics animée par un expert SEO / Wordpress.

Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.