首页 技术 正文
技术 2022年11月7日
0 收藏 317 点赞 1,131 浏览 2295 个字

jquery ajax 中各个事件执行顺序如下:

1.ajaxStart(全局事件)

2.beforeSend

3.ajaxSend(全局事件)

4.success

5.ajaxSuccess(全局事件)

6.error

7.ajaxError (全局事件)

8.complete

9.ajaxComplete(全局事件)

10.ajaxStop(全局事件)

下面看个例子:

 $("#ACCOUNT_TYPE").bind('click', function() {
//alert( $(this).val());
var msg="";
if($(this).val()=="B134002")//托管
{
//msg="托管";
msg="ACCOUNT_TYPE_COM_T";
}
else if($(this).val()=="B134001")//存管
{
//msg="存管";
msg="ACCOUNT_TYPE_COM_C";
}
else if($(this).val()=="-")//存管和托管all
{
//msg="存管和托管";
msg="ACCOUNT_TYPE_COM_ALL";
}
else
{
alert("参数错误!");
return;
} $("#ACCOUNT_TYPE_COMDiv_son").children().remove();//先清除所有子元素
$.ajax({
type:"post",
url:"${ctx}/Rule/Combination/getdict",
data:{type:msg},
dataType:"json",
success:function(json)
{
//$(object).children(selector).remove(); // 删除object元素下满足selector选择器的子元素,不填写则默认删除所有子元素 for(var i=0;i<json.length;i++)
{
var checkBox=document.createElement("input");
//checkBox.setAttribute("type","checkbox");
checkBox.setAttribute("type","radio");
checkBox.setAttribute("id", json[i].value);
checkBox.setAttribute("value", json[i].value);
checkBox.setAttribute("name", "ACCOUNT_TYPE_COM");
checkBox.setAttribute("checked", true);
//checkBox.setAttribute("readonly", true);//
var li=document.createElement("span"); li.style.display = "block";
li.style.width = 23+"%";
li.style.float = "left"; li.appendChild(checkBox);
li.appendChild(document.createTextNode(json[i].label)); $("#ACCOUNT_TYPE_COMDiv_son").append(li); }
}
,
beforeSend:function(mes)
{
alert("beforeSend");
},
complete:function()
{
alert("complete");
}
});
});

运行这段代码,会先弹出 beforeSend  提示,然后加载success 方法里面的代码,最后弹出 complete  提示,这说明这段代码的几个方法的执行先后顺序是符合上面总结的顺序的!

全局事件的例子:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("div").ajaxStart(function(){ $(this).html("<img src='/i/demo_wait.gif' />");
alert("1.最先的全局方法");
});
$("button").click(function(){
$("div").load("/example/jquery/demo_ajax_load.asp");
}); $("div").ajaxSend(function()
{
alert("2.发送前");
});
$("div").ajaxSuccess(function()
{
alert("3.成功后");
});
$("div").ajaxComplete(function()
{
alert("4.ajaxComplete");
});
$("div").ajaxStop(function()
{
alert("5.ajaxStop");
});});
</script>
</head><body><div id="txt"><h2>通过 AJAX 改变文本</h2></div>
<button>改变内容</button></body>
</html>

每次点击 “改变内容” 的这个按钮,都会先加载一次demo_wait.gif 这个图片,然后执行 ajaxSend,然后执行 ajaxSuccess,然后执行ajaxComplete,然后执行 ajaxStop ,这个执行顺序也是符合上面总结的顺序的!

 

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,488
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,903
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,736
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,487
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:8,127
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:5,289