Ajax :六个全局事件
加载请求: .ajaxStart() 和 .ajaxstop()
$(document).ajaxStart(function(){
$('.loading').show();
}).ajaxStop(function(){
$('.loading').hide();
});
错误处理: .ajaxError()
//1 $.ajax()使用属性提示错误
$('form input[type=button]').click(function(){
$.ajax({
type:"post",
url:"test1.php",
async:true,
data:$('form').serialize(),
success:function(response,status,xhr){
$('#box').html(response);
},
// timeout:3000
// global:false
error:function(xhr,errorText,errorType){
// alert(errorText + ':' +errorType);
alert(xhr.status + ':' +xhr.statusText);
} });
}); //2 $.post()使用连缀.error()方法提示错误,将被.fail()取代
$('form input[type=button]').click(function(){
$.post('test1.php').error(function(xhr,errorText,errorType){
alert(errorText + ':' +errorType);
alert(xhr.status + ':' +xhr.statusText);
});
}); //3 使用全局.ajaxError()方法
$(document).ajaxError(function(event,xhr,settings,info){
alert(event.type);
alert(event.target);
for(var i in event){ //打印出event的所有属性
document.write(i + '<br />');
}
});
.ajaxSuccess(),对应一个局部方法:.success(),请求成功完成时执行。
.ajaxComplete(),对应一个局部方法:.complete(),请求完成后注册一个回调函数。
.ajaxSend(),没有对应的局部方法,只有属性 beforeSend,请求发送之前要绑定的函数。
//$.post()使用全局
$('form input[type=button]').click(function(){
$.post('test.php',$('form').serialize());
}); $('document').ajaxSend(function(){
alert(发送请求之前执行);
}).ajaxComplete(function(response,status,xhr){
alert('请求完成后,不管是否失败成功');
}).ajaxSuccess(function(event,xhr,settrings){
alert('请求成功后,不管是否成功');
}).ajaxError(function(event,xhr,settrings){
alert('请求失败后');
}); //$.post()使用局部
$('form input[type=button]').click(function(){
$.post('test.php',$('form').serialize()).success(function(){
alert('请求成功后');
}).complete(function(){
alert('请求完成后');
}).error(function(){
alert('请求失败后');
});
}); //$.ajax()使用属性
$('form input[type=button]').click(function(){
$.ajax({
type:"post",
url:"test1.php",
async:true,
data:$('form').serialize(),
success:function(response,status,xhr){
alert('请求成功后');
},
complete:function(){
alert('请求完成后,不管失败成功');
},
beforeSend:function(){
alert('发送请求之前');
},
error:function(xhr,errorText,errorType){
alert('请求失败后');
}
});
});
注:
在 jQuery1.5 版本以后,使用.success()、.error()和.complete()连缀的方法,可以用.done()、.fail()和.always()取代。
Ajax :六个全局事件的更多相关文章
- jquery的ajax全局事件详解
jquery在ajax方面是非常强大和方便的,以下是jquery进行ajax请求时方法模板: $.ajax({ type: "get", url: "" ...
- 关于数据未渲染完,要获取document高度问题——ajax全局事件
昨天在做开发时,遇到这样一个问题,当页面刚加载的时候,就要获取document的高度,可是此时页面上所有的ajax请求的数据都还没有渲染到页面上,所以导致得到的document的高度仅仅是页面结构的高 ...
- Jquery表单序列化和AJAX全局事件
Jquery表单序列化 1.必须放在form标签内: 2.控件必须有name属性: 3.控件的value值会提交到服务器: 如: <form id="form1"> & ...
- 锋利的jQuery读书笔记---jQuery中Ajax--序列化元素、Ajax全局事件
serialize()方法: 作用于一个jQuery对象,它能够将DOM元素内容序列化为字符串,用于Ajax请求. <!DOCTYPE html> <html> <hea ...
- ajax全局事件
作用:当你的页面存在很多ajax事件的话,我们有一些信息是公共的,可以复用,我们可以用全局事件进行编写,因为每一个ajax事件调用,都会触发ajax全局事件. jquery的ajax方法的全部全局事件 ...
- jquery ajax 全局事件
jquery的ajax方法的全部全局事件:(不管是$.ajax().$.get().$.load().$.getJSON()等都会默认触发全局事件) ajaxStart:ajax请求开始前 ajaxS ...
- jQuery中的Ajax全局事件
Ajax全局事件 全局事件会在有ajax请求的情况下触发. 方法名称 说明 ajaxStart(callback) Ajax请求开始时执行的函数 ajaxStop(callback) Ajax请求结束 ...
- nprogress进度条和ajax全局事件
nprogress和ajax全局事件 nprogress 官方网站:http://ricostacruz.com/nprogress/ 下载地址:https://github.com/rstacruz ...
- 【锋利的jQuery】中全局事件ajaxStart、ajaxStop不执行
最近一直都在研究[锋利的jQuery],确实是一本好书,受益匪浅.但由于技术发展及版本更新等原因,里面还是有些坑需要踩的. 比如:第六章七节中提到的全局事件ajaxStart.ajaxStop照着案例 ...
随机推荐
- PHP分页组件:Paginator
安装 composer require "jasongrimes/paginator:~1.0" 使用 <?php require '../vendor/autoload.p ...
- tp5控制器调用,方法调用
<?php //命名空间 namespace app\index\controller; use app\admin\controller\Deer; class User{ public ...
- MySQL(十一)
1.1 约束条件 约束条件与数据类型的宽度一样,都是可选参数 作用:用于保证数据的完整性和一致性 主要分为: PRIMARY KEY (PK) 标识该字段为该表的主键,可以唯一的标识记录 FOREIG ...
- 转载:【学习之家】Python中__init__.py文件的作用
Python中__init__.py文件的作用详解 Python中__init__.py文件的作用详解 来源:学习之家 作者:xuexi110 人气:357 发布时间:2016-09-29 摘要:__ ...
- PhotoZoom的工具栏 图片放大不失真
使用PhotoZoom能够对数码图片无损放大,备受设计师和业内人员的青睐,它的出现时一场技术的革新,新颖的技术,简单的界面,优化的算法,使得它可以对图片进行放大而没有锯齿,不会失真.本文为您一起来认识 ...
- 激情世界杯,盛夏大放价,CDR 618返场继续嗨
最近被刷屏应该就是世界杯.世界杯和世界杯了... 进行了到第七天的球迷们,你们还好么 私房钱还剩下多少?上班有没有请假迟到? 哎,中国的小龙虾都去俄罗斯了,就国足队员没去… 满屏而来的不仅是手机朋友圈 ...
- Python-ORM实战
Date: 2019-06-03 Author: Sun 什么是ORM? ORM(object relational mapping), 就是对象关系映射,简单来说我们类似python这种面向对象 ...
- 汇编(assembling)简介(源:阮一峰)
简介 计算机真正能够理解的是低级语言,它专门用来控制硬件.汇编语言就是低级语言,直接描述/控制 CPU 的运行.如果你想了解 CPU 到底干了些什么,以及代码的运行步骤,就一定要学习汇编语言. 我们知 ...
- 小程序(Wepy)--生成海报图片
对于小程序的分享, 除了分享给朋友, 好友群,是可以直接做到的, 但是要想扩大推广范围, 通过生成海报图片, 将自己小程序码带进去,应该是目前我所知的好办法了. 但是海报也不是那么好搞.之前自己手写出 ...
- git--客户端管理工具初步使用
说点废话哈 小白一枚, 今年3月份进入自己的第一家公司, 开始成为前端中的一份子,好在公司里有位和我一同进来的一位老哥带着我,从老哥身上学到的知识不多,(因为和老哥只相处工作了三个月,因为家里的事情, ...