上传或提交等待过程图标loading.gif的实现

最新推荐文章于 2025-04-12 21:25:16 发布

yusirxiaer

最新推荐文章于 2025-04-12 21:25:16 发布

阅读量2.5k

点赞数

CC 4.0 BY-SA版权

分类专栏： JQuery

本文链接：https://blog.youkuaiyun.com/yusirxiaer/article/details/81100512

JQuery 专栏收录该内容

22 篇文章

订阅专栏

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<style>

.loadingWrap{

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

z-index:300;

background-image:url(loading.gif);

background-repeat:no-repeat;

background-position:center center;

background-color:#000;

background-color:rgba(0,0,0,0.5);

filter:alpha(opacity=50);

}

</style>


</head>

<body>

测试 加载中。。。

<div class="loadingWrap"></div>

</body>

</html>

ajax提交表单后的等待，应当做如下处理：

$.ajax(

type:"post",

url:basePath + “xxx/xxx/xx.do”,

data:{"idMerchant":idMerchant},

dataType:"json",

success:function(data){//后端返回json格式的字符串

if(!data){//成功不需要提示

alert("提交失败！");

}

},

error:function(){

alert("查询异常，请稍后再试或联系管理员。。。");

},

beforeSend: function(){

$("<div class="loadingWrap"></div>").appendTo("body");

},

complete: function(){

$(".loadingWrap").remove();

}


});