AJAX loading img

Question

我是AJAX/Jquery的新手，在頁面加載img的最佳方式仍然是加載？

這裏是我的代碼：

<div class="container"> 
     <div class="row"> 
      <div class="col-lg-12"> 
      <button class="btn btn-info btn-lg">Load More Page...</button> 
      </div> 
     </div> 
    </div> 


<script type="text/javascript"> 
$(document).ready(function(){ 
    $("button").click(function(){ 
     $("#box").load("page2.php"); 
    }); 
}); 
</script> 

Answer 1

請查看以下鏈接

有例如

How can I create a "Please Wait, Loading..." animation using jQuery?

Answer 2

您可以簡單地使用ajax-方法，如ajaxStart，ajaxStop

Javascript代碼：

$(document).ready(function(){ 
    $(document).ajaxStop(function(){ 
     $('#loadingIndicator').hide(500); 
    }); 
    $(document).ajaxStart(function() { 
     $('#loadingIndicator').show(); 
    }); 
} 

HTML代碼：

<div id="loadingIndicator" style="display:none;z-index:100;"> 
    <img src="loading-big.gif" alt="" /> 
</div>