jquery ajax 中各个事件执行顺序
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 ,这个执行顺序也是符合上面总结的顺序的!
jquery ajax 中各个事件执行顺序的更多相关文章
- jquery ajax中各个事件执行顺序如下
$(function(){ setTimeout(function(){ $.ajax({ url:'/php/selectStudent.php', }); },0); $(document).aj ...
- jquery中各个事件执行顺序如下:
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- 关于AJAX中函数的执行顺序
考察w3school上的一个实际的例子[1]: <html> <head> <script type="text/javascript"> fu ...
- Global中的事件执行顺序
The Global.asax file, sometimes called the ASP.NET application file, provides a way to respond to ap ...
- jquery ajax中事件的执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- jquery ajax 事件执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- jquery ajax中success与complete的执行顺序
jquery ajax中success与complete的执行顺序 jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) ...
- jquery ajax中success与complete的执行顺序 (转)
http://blog.sina.com.cn/s/blog_4adc4b090101dhnh.html https://q.cnblogs.com/q/21810/ **************** ...
- jquery ajax事件执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
随机推荐
- Eisenstein's criterion
https://en.wikipedia.org/wiki/Eisenstein%27s_criterion In mathematics, Eisenstein's criterion gives ...
- 内联扩展 inline expansion
让编译器直接将完整的函数体插入到每一个调用该函数的地方,从而提高函数调用的运行速度. 优秀的JIT编译器会通过侦测运行信息,仅将需要频繁运行的瓶颈部分进行编译,从而大大削减编译所需的时间. 而且,利用 ...
- zcat,zgrep用法
为减少日志文件占用的空间,很多情况下我们会将日志文件以天或周为周期打包成tar.gz 包保存.虽然这样做有利空间充分利用,但当我们想查看压缩包内的内容时确很不方便.如果只是一个tar.gz文件,可以将 ...
- 【Python全栈-后端开发】MySQL数据库-练习题
MySQL数据库-练习题 一.表关系 请创建如下表,并创建相关约束 二.操作表 1.自行创建测试数据 2.查询“生物”课程比“物理”课程成绩高的所有学生的学号: 3.查询平均成绩大于60分的同学的学号 ...
- commonjs模块和es6模块的区别?
commonjs模块和es6模块最主要的区别:commonjs模块是拷贝,es6模块是引用,但理解这些,先得理解对象复制的问题,在回过头来理解这两模块的区别. 一.基本数据类型的模块 ./a1.js ...
- VS2013 opencv配置
有三个地方需要配置,在配置之前首先要将platform配置好,下面的例子是x64 Release的“ 然后需要将include.lib的路径配置好 然后将dll拷贝至编译生成的Release文件夹中即 ...
- 前端 HTML body标签相关内容
想要在网页上展示出来的内容一定要放在body标签中. 常用标签: 标题标签 h1-h6 段落标签 p标签 超链接标签 a标签 列表标签 ul,ol,li 定义列表<dl> 子标签 div ...
- 帝国cms支持的变量及灵动标签变量汇总
帝国CMS对首页.列表页.内容页这三个页面模板支持的变量是不同的,有的是通用的,有的不是通用的,本文就这三个模板常用的变量列于此,另外灵动标签很好用啊,也顺便收藏于此,以备后用,到时不用到处翻来翻去的 ...
- 前端框架之Vue(3)-计算属性
计算属性 模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> {{ ...
- CMDB资产管理
.传统运维和自动化运维的区别: 传统运维: 1.项目上线: a.产品经理前期调研(需求分析) b.和开发进行评审 c.开发进行开发 d.测试进行测试 e.交给运维人员进行上线 上线: 直接将代码交给运 ...