阅读:8498回复:1
页面加载时显示一个loading的图片或者动画或者提示信息
写在body的下面第一句
。文字:<div id="loadingdiv">正在载入,请稍候……</div> 。图片 <div id="loadingdiv" style="display:block;"> <div class="loading-block show"> <img src="images/aaa.gif" style="width: 110px;height: 110px;"> </div> </div> 设置一下图片的样式,让他放在屏幕的中间。所有内容的上面 #loadingdiv { position: relative; margin-top: 10px; } .loading-block { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; background: rgba(0,0,0,0.4); display: none; background: transparent; } 他们起始的状态就是显示的,在这里需要文章加载完就隐藏. 如果是没有ajax的情况,可以用 window.onload=function(){ $("#loadingdiv").hide(); } 如果是写在app里面。你需要在mui.plusReady(function(){ $("#loadingdiv").hide(); }) 如果有ajax,你可以写在 $.ajax({ url:'', beforeSend: function(data) {$("#loadingdiv").show();}, compete:function(){$("#loadingdiv").hide();} }) beforeSend和conpete还有防止按钮重复提交的功能 $.ajax({ type: "post", data: studentInfo, contentType: "application/json", url: "/Home/Submit", beforeSend: function () { // 禁用按钮防止重复提交 $("#submit").attr("disabled", "disabled"); }, success: function (data) { if (data == "Success") { //清空输入框 clearBox(); } }, complete: function () { $("#submit").removeAttr("disabled"); }, |
|
沙发#
发布于:2018-07-10 22:06
|
|