title: 4-States button (with .toggle()) and delayed Ajax in each state
body: <p>I've got a 4-states button. I would like to know how to delay the execution of my ajax request in order to have only one request at the end...</p>
  
  <p>I mean, if I press the button twice, i don't want to execute the first ajax request, but only the second one after a specific timeout.</p>
  
  <pre><code>$('.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&amp;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&amp;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&amp;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&amp;data="+donnees ,
                      succes : function(data) {
                      console.log(data);}
  
                  });
  
              },1000);
  
  
          }
      );
  </code></pre>
  
  <p>This code doesn't work, I've got a request for each state.</p>
  
  <p>Thanks for your help!</p>