Кнопка 4-государств (с .toggle()) и задержкой Ajax в каждом состоянии

Question

У меня есть кнопка с 4 состояниями. Я хотел бы знать, как отложить выполнение моего запроса ajax, чтобы иметь только один запрос в конце ...

Я имею в виду, если я дважды нажимаю кнопку, я не хочу запускать первую ajax, но только второй после определенного тайм-аута.

$('.btn_mark_erreur').toggle(
     function(){ 
//State 1 
      var id_erreur = $(this).parent().attr('erreur_num'); 
      $(this).attr('title','Erreur réglée'); 
      $(this).children('img').attr('src','img/erreur_ok.png'); 


      setTimeout(function(){ 

       $.ajax({ 
        type: 'POST', 
        url: "", 
        dataType: ($.browser.msie) ? "text" : "xml", 
        data: "a=maj_statut&data="+donnees , 
        succes : function(data) { 
        console.log(data);} 

       }); 

      },1000); 

     }, 
     function(){ 
//State 2 
      var id_erreur = $(this).parent().attr('erreur_num'); 
      $(this).attr('title','Erreur en cours'); 
      $(this).children('img').attr('src','img/erreur_encours.png'); 

      setTimeout(function(){ 

       $.ajax({ 
        type: 'POST', 
        url: "", 
        dataType: ($.browser.msie) ? "text" : "xml", 
        data: "a=maj_statut&data="+donnees , 
        succes : function(data) { 
        console.log(data);} 

       }); 

      },1000); 

     }, 
     function(){ 
//State 3 
      var id_erreur = $(this).parent().attr('erreur_num'); 
      $(this).attr('title','Problème sur cette erreur'); 
      $(this).children('img').attr('src','img/erreur_nok.png'); 


      setTimeout(function(){ 

       $.ajax({ 
        type: 'POST', 
        url: "", 
        dataType: ($.browser.msie) ? "text" : "xml", 
        data: "a=maj_statut&data="+donnees , 
        succes : function(data) { 
        console.log(data);} 

       }); 

      },1000); 
     }, 
     function(){ 
//State 0 
      var id_erreur = $(this).parent().attr('erreur_num'); 
      $(this).attr('title','Marquer comme...'); 
      $(this).children('img').attr('src','img/erreur_statut.png'); 




      setTimeout(function(){ 

       $.ajax({ 
        type: 'POST', 
        url: "", 
        dataType: ($.browser.msie) ? "text" : "xml", 
        data: "a=maj_statut&data="+donnees , 
        succes : function(data) { 
        console.log(data);} 

       }); 

      },1000); 


     } 
    ); 

Этот код не работает, у меня есть запрос для каждого штата.

Благодарим за помощь!

Answer 1

setTimeout возвращает значение - идентификатор таймера. Вы можете передать это значение clearTimeout, чтобы таймер был отменен. Пример:

var timers = new Array(null, null, null, null); 
function cancelRequestsUpTo(n) { 
    for (int i = 0; i <= n; ++i) 
     if (timers[i] != null) clearTimeout(timers[i]); 
} 

$("#btn_mark_error").toggle(function() { 
    //... 
    timers[0] = setTimeout(function() { $.ajax(...); }, 1000); 
}, 
function() { 
    timers[1] = ...; 
    cancelRequestsUpTo(0); 
}, 
.... 
); 

Обратите внимание, что когда-то $.ajax фактически выполняет не существует никакого способа (по крайней мере, не так, как я знаю), что вы можете отменить запрос уже в ожидании. Я предлагаю только отменять настроенные вами таймеры.