ajax--loading加载

	<script>
		var srcL="{% static '/image/loading.gif' %}"
		//在页面未加载完毕之前显示的loading Html自定义内容
		var _LoadingHtml = '<div id="loadingDiv" style="display: none; "><div id="over" style=" position: absolute;top: 0;left: 0; width: 100%;height: 100%; background-color: #f5f5f5;opacity:0.5;z-index: 1000;"></div><div id="layout" style="position: absolute;top: 40%; left: 40%;width: 20%; height: 20%;  z-index: 1001;text-align:center;"><img src="'+srcL+'" /></div></div>';
		//呈现loading效果
		console.log(_LoadingHtml)
		document.write(_LoadingHtml);
		 
		//移除loading效果
		function completeLoading() {  
				document.getElementById("loadingDiv").style.display="none";
		}
		//展示loading效果
		function showLoading(){
		document.getElementById("loadingDiv").style.display="block";
		}


		function addSubscribe(){
			 $.ajax({   
			     type: "post",   
			     contentType: "application/json",   
			     url: "{% url 'Subscribe' %}",   
				 headers: {"X-CSRFToken":$.cookie('csrftoken')}, 
			     beforeSend: function () {   
			         showLoading();
			     },   
			     success: function (data) {   
			         if (data == "Success") {   
			             // ...   
			         }   
			     },   
			     complete: function () {   
			         completeLoading();   
			     },   
			     error: function (data) {   
			         console.info("error");   
			     }   
			 });   
		}
	</script>

posted @   starSgz  阅读(348)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 记一次.NET内存居高不下排查解决与启示
点击右上角即可分享
微信分享提示