ajax请求成功前loading
1.jquery方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax加载loading图标</title>
</head>
<body>
<form id="test-form" action="test.php" method="post">
<input type="text" name="username">
</form>
<button id="btn">提交</button>
<div id="loading"></div>
<div id="res"></div>
</body>
<script>
$('#btn').click(function(){
$.ajax({
url:$('#test-form').attr('action'), //发送后台的url
type:'post',
data:$('#test-form').serialize(), //序列化表单内容
dataType:'text', //后台返回的数据类型
timeout:15000, //超时时间
beforeSend:function(XMLHttpRequest){
$("#loading").html("<img src='./images/loading.gif' />"); //在后台返回success之前显示loading图标
},
success:function(data){ //data为后台返回的数据
$("#loading").empty(); //ajax返回成功，清除loading图标
$('#res').html('ajax请求成功！');
}
});
});
</script>
</html>
2.js方式
xmlhttp.onreadystatechange = function(){
var loadingdiv = document.getelementbyid("loading");
loadingdiv.innerhtml = "loading...";
loadingdiv.style.right = "0";
loadingdiv.style.top = "0";
loadingdiv.style.display = "block";
//load completed
if(xmlhttp.readystate == 4) {
loadingdiv.style.display = "none";
loadingdiv.innerhtml = "";
if(xmlhttp.status == 200) {
var str = xmlhttp.responsetext;
/* do something here ! */
}
else
alert("error!" + "nstatus code is: " + xmlhttp.status + "nstatus text is: " + xmlhttp.statustext);
}
}
ajax请求成功前loading的更多相关文章
- ajax请求成功前，加载中loading显示
/*第一次刷新--非定时器刷新数据*/ var fistInitColumn = true; var getAllColumnDatas = function(){ var params = {}; ...
- jquery Ajax请求中显示Loading...
jquery Ajax请求中显示Loading... $('#btnTest').click(function(){ $.ajax({ url ---- ,根据你需要设置 ...
- ajax请求成功后打开新开窗口(window.open())被拦截的解决方法
问题:今天在做项目时需要在ajax请求成功后打开一个新的窗口,此时遇到浏览拦截了新窗口的问题,尝试在ajax 回调函数中模拟执行 click 或者 submit 等用户行为(trigger('clic ...
- Ajax请求成功但是一直进入error的原因
1.在1.3版本的jQuery以后,严格要求了json格式,如果返回的值不是json格式,他就会执行error函数. 所以如果想让他走success函数的话,还是在后台把数据格式化成json格式吧. ...
- ajax请求成功,但是进入error
ajax请求成功,这是因为json数据没有严格按json格式返回
- ajax请求加全局loading , 个别特殊请求不显示loading
项目中,请求开始前加载loading遮罩层,请求结束关闭遮罩,一般都会加在全局中,但有个别请求不需要加全局loading 的话,这时候就需要对这些请求进行配置 全局加loading: ; functi ...
- IE9中ajax请求成功后返回值却是undefined
ie9中ajax请求一般处理程序成功后返回值始终是undefined,在网上找过很多资料,大致意思都是说前后端编码不一致造成的,但是按照资料上的方案去修改却发现根本不能解决我的问题,试过好多种方案都不 ...
- ajax请求成功后新开窗口window.open()被拦截解决方法
ajax 异步请求成功后需要新开窗口打开 url,使用的是 window.open() 方法,但是很可惜被浏览器给拦截了,怎么解决这个问题呢 问题: 前面开发项目时碰到一个问题,ajax 异步请求 ...
- ajax请求成功后新窗口window.open()被拦截的解决方法
ajax 异步请求成功后需要新开窗口打开 url,使用的是 window.open() 方法,但是该操作并不是用户主动触发的,所以它认为这是不安全的就拦截了(不过如果是 _self 的话就不会有这个限 ...
随机推荐
- mybatis入门介绍一
首先介绍一下Mybatis是什么?mybatis是Java的持久层框架, JAVA操作数据库是通过jdbc来操作的,而mybatis是对jdbc的封装. 使用mybatis之后,开发者只需要关注sql ...
- Android中的Activity
Android四大组件 活动(Activity) 广播接收者(BroadCastReceiver) 服务(Service) 内容提供者(Contentprovider) Activity 先来看And ...
- [dubbo实战] dubbo+zookeeper伪集群搭建
zookeeper作为注册中心,服务器和客户端都要访问,如果有大量的并发,肯定会有等待.所以可以通过zookeeper集群解决. 一.为什么需要zookeeper呢? 大部分分布式应用需要一个主控.协 ...
- windows下Ubuntu虚拟机联网配置 + Ubuntu虚拟机代理配置
Ubuntu虚拟机网络连接方式设置: http://blog.csdn.net/u013052460/article/details/50039937 or http://www.gezila.com ...
- Java中容器的两种初始化方式比较
List,Set,Map的两种初始化赋值方式 List List<Integer> list2 = new ArrayList<Integer>(); for (int i= ...
- HTML中的target标记
HTML:target=_blank -- 在新窗口中打开链接 _parent -- 在父窗体中打开链接 _self -- 在当前窗体打开链接,此为默认值 _top -- 在当前窗体打开链接,并替换当 ...
- 【head first python】2.共享你的代码 函数模块
#coding:utf-8 #注释代码! #添加两个注释,一个描述模块,一个描述函数 '''这是nester.py模块,提供了一个名为print_lol()的函数, 这个函数的作用是打印列表,其中可能 ...
- HTML 文本格式化实例 超链接
HTML 文本格式化实例 1.文本格式化 <b>加粗文字</b> <strong>加重语气</strong> <big>dingyi< ...
- 正则表达式（即：匹配模式Pattern）
通过学习<正则表达式-Regular-Expression-Tutorial.pdf>这份文档,对正则表达式有了很好的了解,原因只有1个--这份文档写得太好了. 它的下载地址是:http: ...
- CSS3基础(3)——CSS3 布局属性全接触
一. 弹性盒模型 1.弹性盒子模型介绍 弹性盒模型(Flexible Box或Flexbox)是一个CSS3新增布局模块,官方称为CSS Flexible Box Layout Module,用于实现 ...