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 @ 2022-06-18 16:41  starSgz  阅读(359)  评论(0)    收藏  举报