Stopper execution $.ajax() après un clic

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

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 15: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


UsagiYojimbo
WRInaute accro
WRInaute accro
 
Messages: 12071
Enregistré le: 23 Nov 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 15:50

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

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 15:59

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


UsagiYojimbo
WRInaute accro
WRInaute accro
 
Messages: 12071
Enregistré le: 23 Nov 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 16: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.

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 16:21

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


UsagiYojimbo
WRInaute accro
WRInaute accro
 
Messages: 12071
Enregistré le: 23 Nov 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 16:33

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


UsagiYojimbo
WRInaute accro
WRInaute accro
 
Messages: 12071
Enregistré le: 23 Nov 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 16: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/


spout
WRInaute accro
WRInaute accro
 
Messages: 8336
Enregistré le: 14 Mai 2003

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 16:35

Tu lances le clearInterval(looper) dans l'event click.

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 16: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;
});

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 17: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 !
   
});

});


UsagiYojimbo
WRInaute accro
WRInaute accro
 
Messages: 12071
Enregistré le: 23 Nov 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 17: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/

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Re: Stopper execution $.ajax() après un clic

Message le Dim Mar 05, 2017 17: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 !
   
});

});

gotgot
WRInaute discret
WRInaute discret
 
Messages: 184
Enregistré le: 1 Oct 2014

Re: Stopper execution $.ajax() après un clic

Message le Lun Mar 06, 2017 9:46

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


niap
WRInaute discret
WRInaute discret
 
Messages: 137
Enregistré le: 17 Oct 2009

Re: Stopper execution $.ajax() après un clic

Message le Lun Mar 06, 2017 10: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.


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.

Lectures recommandées sur ce thème :