jQuery $.ajaxSend()

语法:

$("#msg").ajaxSend(function(evt,request,settings){});

AJAX请求发送前执行函数。Ajax事件。

XMLHttpRequest对象和设置作为参数传递给回调函数

$("#msg").ajaxSend(function(evt,request,settings){})是全局事件,也就是说,

只要该页面定义了这个函数,那么,在每个ajax请求前都会执行该函数,这既与该函数前面的选择器#msg无关,

也与用$.get还是$.post请求无关。看下面例子:

<script type="text/javascript">
	$(document).ready(function() {

		$("#msg").ajaxSend(function() {
			alert("无论点击按钮1还是按钮2,都会触发我");
		});

		$("#btn1").click(function() {
			$.post("test1", function() {
				$("#msg").val("haha");
			});
		});

		$("#btn2").click(function() {
			$.get("test2", function() {
				$("#msg").val("haha");
			});
		});
	})
</script>

<body>
	<input type="text" id="msg" value="" />

	<button id="btn1">
		按钮1
	</button>
	<button id="btn2">
		按钮2
	</button>
</body>

上面只在一处定义了全局事件$("#msg").ajaxSend(function(){});

我们发现无论是单击id="btn1"执行$.post请求,还是单击id="btn2"执行$.get请求,都会触发全局事件.

需要注意的是上面定义$("#msg").ajaxSend(function(){});事件不在任何一下onClick事件中。

如果是定义在btn1或btn2中的任何一个click事件中,那么,该全局事件会增加执行次数,而不是覆盖。

$("#msg").ajaxStart(function(){ })与$("#msg")ajaxSend(function(){ })函数使用方法相大部分相同,也是全局事件.

区别是ajaxStart执行的顺序早于ajaxSend执行,另外,$("#msg").ajaxStart(function(){ })的执行函数无参数

而$("#msg").ajaxSend(function(evt, request, settings){ })的执行函数可以有参数。

这样,虽然该函数是全局函数,我们可以根据参数值的不同而让其对不同的触发产生不同的效果看如下的例子:

<script type="text/javascript">
	$(document).ready(function() {

		$("#msg").ajaxSend(function(event, obj, options) {
			if (options.url == "test1") {
				alert("按钮1");
			} else if (options.url == "test2") {
				alert("按钮2");
			}
		});

		$("#btn1").click(function() {
			$.post("test1", function() {
				$("#msg").val("haha");
			});
		});

		$("#btn2").click(function() {
			$.get("test2", function() {
				$("#msg").val("haha");
			});
		});
	})
</script>
<body>
	<input type="text" id="msg" value="" />

	<button id="btn1">
		按钮1
	</button>
	<button id="btn2">
		按钮2
	</button>
</body>

第二个例子和第一个相比在ajaxSend函数中加入了参数并在函数里进行了判断。

对于$("#msg").ajaxSend(function(event, obj, options){})函数,注意对于形参来说,只要位置对应,用什么字符来表示是无所谓

event - 包含event对象具体的属性主要有很多,需要知道的一个最重要的属性是该对象包含{type:事件名}事件名就是ajax全局事件,

在此例中为ajaxSend,也就是说event对象有一个属性type其值为"ajaxSend"

obj - 包含XMLHttpRequest对象,主要是该对象的请求状态参数。

options - 包含AJAX请求中使用的选项,主要是当前请求的一些设置参数比如上面用到的url

如果想查看全部的属性,可用console.info()打印到控制台,如截图:

作者:itmyhome

时间: 2024-10-13 16:08:33

jQuery $.ajaxSend()的相关文章

Python Day17(jQuery)

一.概述 1.简介 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨是"write Less,Do More",即倡导写更少的代码,做更多的事情.它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作.事件处理.动画设计和Ajax交互. jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口

javascript & jQuery

//获取表格行数和列数 //表格行数 var rows = document.getElementById("example_table").rows.length; //表格列数 var cells = document.getElementById("example_table").rows.item(0).cells.length; javascript & jQuery

You Don&#39;t Need jQuery

前端发展很快,现代浏览器原生 API 已经足够好用.我们并不需要为了操作 DOM.Event 等再学习一下 jQuery 的 API.同时由于 React.Angular.Vue 等框架的流行,直接操作 DOM 不再是好的模式,jQuery 使用场景大大减少.本项目总结了大部分 jQuery API 替代的方法,暂时只支持 IE10+ 以上浏览器. 目录 Translations Query Selector CSS & Style DOM Manipulation Ajax Events Ut

ajaxStart 和 ajaxSend 不执行

我们一般会在loading 效果的时候会用上这两个全局事件 ajaxStart 和 ajaxSend 但是要注意的是 在同时有多个ajax 执行的时候ajaxStart 只会执行一次 所以一般情况下 请用ajaxSend不过 ajaxSend也有个比较坑的是----如果直接打开页面的时候有两个ajax需要执行,其中一个不会触发ajaxSend 请在其中一句加上这句话 setTimeout(function(){ ......... },1); 把你要执行的语句写在 settimeout 里面即可

bootstrap下拉框的例子,提示Error: Bootstrap&#39;s JavaScript requires jQuery

bootstrap很多js依赖jquery,所以需要引入jquery 遇到的问题: 页面访问提示:Error: Bootstrap's JavaScript requires jQuery 解决方法: 在引入bootstrap的js文件之前,先引入jquery.js 导入顺序可以向下面一样 <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script><link rel

全局为每一个ajax请求都附带一个loading效果 .ajaxSend

描述: 在Ajax请求发送之前绑定一个要执行的函数,这是一个 Ajax Event. 添加的版本: 1.0.ajaxSend( handler(event, jqXHR, ajaxOptions) ) handler(event, jqXHR, ajaxOptions) 类型: Function() 被调用的函数. 每当一个Ajax请求即将发送,jQuery就会触发ajaxSend事件,在这个时间点所有处理函数都会使用.ajaxSend()方法注册并执行. 观察这种方法,建立一个基本的Ajax加

看了就很快学会jQuery

一.jQuery简介与第一个jQuery程序 1.1.jQuery简介 1.2.jQuery特点 1.3.jQuery版本 1.4.获得jQuery库 1.5.第一个jQuery程序 二.jQuery对象和DOM对象 2.1.DOM对象 2.2.jQuery对象 2.3.DOM转换成jQuery对象 2.4.jQuery对象转换成DOM对象 2.5.DOM对象与jQuery对象区别 三.常用选择器 3.1. 选择器和包装集 3.2.   基本选择器 3.2.1.通过id获取元素 3.2.2.通过

Uncaught Error: Bootstrap&#39;s JavaScript requires jQuery

boostrap下拉菜单无效,浏览器报Uncaught Error: Bootstrap's JavaScript requires jQuery错误 解决办法:注意css,js文件引入的先后顺序,首先引入jquery的js文件再引入bootstrap的css文件. Uncaught Error: Bootstrap's JavaScript requires jQuery

(function($){...})(jQuery)的意思

这里实际上是匿名函数 function(arg){...} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即: (function(arg){...})(param) 这就相当于定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数 而(function($){...})(jQuery)则是一样的,之所以只在形参使用$,是为了不与其他库冲突,所以实参用jQuery var fn = functio