1. 页面引入loading.js。且在页面上添加<div id="loading"></div>

2. 加载数据之前进行调用。调用方法如下：

loading = new loadingObj($("#loading"), buildURI("images/"));

loading.init();

loading.show();

$("#service_slist").hide();

$("#listArea").empty();

$("#pageArea").empty();

$("#fw_empty").hide();

if(typeof window.xhrCache != 'undefined') {

    typeof window.xhrCache.abort == 'function' && window.xhrCache.abort();

}

window.xhrCache = $.ajax( {

    type : "post",

    dataType : "text",

    url: url,

    data: data,

    success :     function(res){    

        loading.hide();

        ………………………………

        }

    });

 

 

loading.js

var loadingObj = function(viewObj, imgPathPrefix){    var imgName = "loading_pa.gif";    this.css = ".loading_box{background:url("+ imgPathPrefix + imgName +") center top no-repeat; padding-top:30px; width:100%; font-size:12px; text-align:center; color:#cccccc;}";    this.html = "
     
      正在加载中，请稍后...
     
";    this.viewObj = viewObj;}loadingObj.prototype = {    init: function(){        var style = $("");        var head = $("head").length > 0 ? $("head").eq(0) : $("head");        style.appendTo(head);        this.viewObj.html(this.html);    },    show: function(){        this.viewObj.show();    },    hide: function(){        this.viewObj.hide();    }};