您的位置:首页 > 其它

将数据加载时显示的图片和文字提成公共的--实现方法

2014-02-13 11:28 579 查看
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 = "<div class='loading_box'>正在加载中,请稍后...</div>";
this.viewObj = viewObj;
}

loadingObj.prototype = {
init: function(){
var style = $("<style>"+ this.css +"</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();
}
};
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: