页面仍在加载时,放置加载IMG的最佳方法是什么?

我对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>

You can simply use ajax- methods like ajaxStart, ajaxStop

Javascript code:

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

HTML code:

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