ajax提交加载进度条示例代码
发布时间：2020-12-16 00:51:38 所属栏目：百科 来源：网络整理
导读：现效果图 加载图片 实现方式: 在jsp页面中加入 样式 代码如下: .progress{z-index: 2000} .mask{position: fixed;top: 0;right: 0;bottom: 0;left: 0; z-index: 1000; background-color: #2F2F2F} 节点 代码如下: img id="progressImgage" class="progress" s
|
现效果图
加载图片 实现方式: 在jsp页面中加入 样式 代码如下: .progress{z-index: 2000} .mask{position: fixed;top: 0;right: 0;bottom: 0;left: 0; z-index: 1000; background-color: #2F2F2F} 节点 代码如下: <img id="progressImgage" class="progress" style="display:none" alt="" src="/ajax-loader.gif"/> <div id="maskOfProgressImage" class="mask" style="display:none"></div> js 代码如下: <p> </p><p>var img = $("#progressImgage"); var mask = $("#maskOfProgressImage");</p> 代码如下: $.ajax({ url:url,type:"post",dataType:"json",data:data,beforeSend:function(xhr){ img.show().css({ "position": "fixed","top": "40%","left": "45%","margin-top": function () { return -1 * img.height() / 2; },"margin-left": function () { return -1 * img.width() / 2; } }); mask.show().css("opacity","0.1"); },success:function(result){ doSuccess() },complete:function(xhr){ img.hide(); mask.hide(); } }); （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |