Ekran 'yükleme' görüntü AJAX çağrı devam

Question

olduğunda aşağıdaki jQuery Ajax aramanız var: ajax çağrı devam ederken

$.ajax({ 
        type: "POST", 
        url: "addtobasket.php", 
        data: "sid=<?= $sid ?>&itemid=" + itemid + "&boxsize=" + boxsize + "&ext=" + extraval, 
        success: function(msg){ 
        $.post("preorderbasket.php", { sid: "<?= $sid ?>", type: "pre" }, 
        function(data){ 
         $('.preorder').empty(); 
         $('.preorder').append(data); 
        }); 
        } 
       }); 

Ben bir resmi görüntülemek istiyorum. Bunu nasıl yapabilirim? Sadece $ .ajax() bu aramadan önce görüntüyü ve sonra gizlemek/sadece .empty()/önce yazılan işleyici işlevine (görüntüyü kaldırın. Ekleme (veri olabilir

Answer 1

bu deneyin:

<script type="text/javascript"> 
    $(document).ready(function() 
    { 
     $('#loading') 
      .hide() 
      .ajaxStart(function() { 
       $(this).show(); 
      }) 
      .ajaxStop(function() { 
       $(this).hide(); 
      }); 
    }); 
</script> 

<div id="loading"> 
     Loading.... 
</div> 

Bu, ajax isteğinde bulunduğunuz her seferde yükleme resmini gösterecek, bu div'u sayfamın üst kısmına yerleştirdim, bu yüzden sayfa ile engellenmiyor, ancak ajax çağrısının ne zaman gittiğini her zaman görebilirsiniz üzerinde.

Answer 2

sayesinde,) çağıran bu satırlar boyunca

Answer 3

şey (showLoadingImage ve hideLoadingImage size kalmış bulunmaktadır).

// show the loading image before calling ajax. 
showLoadingImage(); 

$.ajax({ 
    // url, type, etc. go here 
    success: function() { 
     // handle success. this only fires if the call was successful. 
    }, 
    error: function() { 
     // handle error. this only fires if the call was unsuccessful. 
    }, 
    complete: function() { 
     // no matter the result, complete will fire, so it's a good place 
     // to do the non-conditional stuff, like hiding a loading image. 

     hideLoadingImage(); 
    } 
});