Ajax,我一直读的是"阿贾克斯",据当时大学老师讲该读音出处是依据当年风靡欧洲的荷兰足球俱乐部阿贾克斯的名字来的,我认为说法挺靠谱的。

jQuery封装了Ajax的交互过程，用户不须要考虑XMLHttpRequest对象的兼容性问题以及使用XMLHttpRequest建立连接、发送请求、发送方式、接收方式等细节，利用jQuery定义

的几个简单方法。就可以轻松实现client与服务端异步通信的问题，从而帮助开发者从繁琐的技术细节中解脱出来，专心于业务层开发工作。

最初始的JavaScript的Ajax在刚刚接触编程的时候接触过，如今都忘没了，仅仅记得首先得获取XMLHttpRequest对象，实际开发中用的全都是jQuery封装好的Ajax，用的也是非常繁。

jQuery中$.ajax()方法属于最底层的方法，第二层是load()、$.get()和$.post()方法，第三层是$.getScript()和$.getJSON()方法，当中当属第二层的三个方法使用的频率最高。

1、使用get和post请求

get()方法包括4个參数，说明例如以下：

第一个參数表示要请求的URL地址

第二个參数表示一个对象结构的 名/值对 列表

第三个參数表示异步交互成功之后调用的回调函数，回调函数的參数值为server端对应的信息。

第四个參数表示server端响应信息返回的内容格式(如XML、HTML、Script、JSON、Text)

当中第一个參数Url是必选參数。后面三个为可选參数。

get()方法是仅仅能在请求成功后调用回调函数,假设要在出错的时候运行回调函数。则必须使用$.ajax()方法。第二个參数所传递的參数能够写在url后面。

<span style="font-family:SimSun;font-size:12px;">		$.get(

				"test1.jsp",

				{

					name:"haha",

					pass:"123"

				},

				function(data){			//回调函数

					alert(data);		//响应信息

				}

			)

		就能够改成

		$.get

		(

			"test1.jsp?

name=haha&pass=123",function(data){

				alert(data);

			}

		)	</span>

jQuery还定义了两个专用方法getJSON()和getScript()。这两个方法的功能和使用方法与get是全然同样的,仅仅是支持前三个參数,不须要设置第四个參数，从他们的名字上就看出了他

们已经指定响应数据的类型。

post()方法与get()方法差点儿同样,仅仅是请求方式的不同,详细选择哪种请求方式开发者自己依据特定需求去决定。

2、$.ajax

$.ajax方法的一些參数

url 
 发送请求的地址,默觉得当前页面地址。
type
 设置请求方式，如GET或者POST，默觉得GET。
timeout
 设置请求超时时间(毫秒)。

此设置将覆盖全局设置。
data
 发送到server的数据。将自己主动转换为请求字符串格式,必须为key/value格式。
dataType
 预期server返回的数据类型。假设不指定，jQuery自己主动依据HTTP包括的MINE信息返回responseXML或responseText。

 xml：返回xml文档，可用jquery处理

 html：返回纯文本HTML信息：包括的script标签会在插入DOM时运行

 script：返回纯文本JavaScript代码。不会自己主动缓存结果,除非设置了cache參数。

 json：返回JSON数据

 text：返回纯文本字符串
async                                           
 boolean类型,这个參数极为重要！

！

设置是否为异步请求,默觉得true,即全部请求均为异步请求。

假设须要发送同步请求,设置为false就可以。

同步和异步的差别,同步请求将锁住浏览器,用户其它操作必须等待请求完毕才干够运行;而异步请求不会影响其它代码的运行。回忆一下曾经遇到过这样的问题,就是在ajax方法内给变量赋值,再ajax方法后面alert该变量,有时候是得不到ajax方法内赋予的那个值。就是由于ajax请求设置的是异步请求的原因。
beforeSend
 发送请求可改动XMLHttpRequest对象的函数,如加入自己定义的HTTP头,XMLHttpRequest对象时唯一參数，该函数假设返回fasle,能够取消本次Ajax请求。不经常使用，反正我是还没用过。
cache
 设置缓存。默认值为true,当dataType为script的时候默认值是false，设置为false的时候将不会从浏览器缓存中载入请求信息。曾经遇到过这个參数设置不正确导致的问题,比較经常使用。
complete
 请求完毕后的回调函数(请求成功和失败均调用)。该函数包括两个參数：XMLHttpRequest对象和一个描写叙述成功请求的类型的字符串。
global
 是否触发全局Ajax事件，默认值为true。设置为false将不会触发全局ajax事件，如ajaxStart或ajaxStop可用于控制不同的Ajax事件
success
 请求成功后的回调函数,函数的參数是由server返回并依据dataType參数进行处理后的数据
error
 请求失败时调用的回调函数。该函数包括三个參数：XMLHttpRequest对象、错误信息（可选）、捕获的错误对象。假设发生了错误,错误信息（第二个參数）除了得到null之外。还可能是timeout、error、notmodified和parsererror。
scriptCharset
 仅仅有当请求时datatype为jsonp或script,而且type是GET才会用于强制改动charset。

通常在本地和远程的内容编码不同一时候使用。
dataFilter
 给Ajax返回的原始数据进行预处理的函数。提供data和type两个參数，data是ajax返回的原始数据，type是ajax请求时设置的dataType參数。函数的返回值将由jquery进一步处理。


其余也有一些。差点儿没用过，不整理了。

3、跟踪状态

jQuery在XMLHttpRequest对象定义的readyState属性基础上，对异步交互中server响应状态进行封装,提供了6个响应事件,以便于进一步细化对整个请求响应过程的跟踪

<span style="font-family:SimSun;font-size:12px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> New Document </title>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <script  src="jquery-2.1.0.min.js" type="text/javascript"></script>

  <script type="text/javascript">

	//页面载入方法

	$(function(){

		$("input").click(function(){

			$.ajax({

				type:"POST",

				url:"addClass.html",

				data :"name=css8"

			});

			//设置全局ajax跟踪事件

			$(document).ajaxStart(function(){

				alert("Ajax请求開始")

			});

			$(document).ajaxSend(function(){

				alert("Ajax请求将要发送")

			});

			$(document).ajaxComplete(function(){

				alert("Ajax请求完毕")

			});

			$(document).ajaxSuccess(function(){

				alert("Ajax请求成功")

			});

			$(document).ajaxStop(function(){

				alert("Ajax请求结束")

			});

			$(document).ajaxError(function(){

				alert("Ajax请求失败")

			});

		})

	})

  </script>

 </head>

 <body>

	 <input type="button"  value="ajax请求过程">

 </body>

</html></span>

4、设置Ajax全局參数

对于频繁与server进行交互的页面来说,每一次交互都要设置很多选项,这样的操作是非常繁琐的,也easy出错。为此,jQuery定义了ajaxSetup()方法，该方法能够预设异步交互中的通用

选项。从而减轻频繁设置选项的繁琐。

ajaxSetup()方法的參数跟$.ajax()方法的參数类似,都是一个參数列表,在该方法中设置的选项能够实现全局共享,从而在详细的交互中仅仅要

设置个性化參数就可以。

用法：

<span style="font-family:SimSun;font-size:12px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> New Document </title>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <script  src="jquery-2.1.0.min.js" type="text/javascript"></script>

  <script type="text/javascript">

	//页面载入方法

	$(function(){

		$.ajaxSetup({

			type:"POST",

			dataType:"text",

			success:function(data){

				alert(data);

			}

		});

		$("input").eq(0).click(function(){

			$.ajax({

				data:"name=wang"

			});

		});

		$("input").eq(1).click(function(){

			$.ajax({

				data:"name=zhang"

			});

		});

	})

  </script>

 </head>

 <body>

	<input type="button" value="按钮1" onclick="">

	<input type="button" value="按钮2" onclick="">

 </body>

</html></span>

知道有这个东西即可,用起来还是比較简单 的。

jQuery整理笔记八----jQuery的Ajax的更多相关文章

  1. jQuery整理笔记文件夹

    jQuery整理笔记文件夹 jQuery整理笔记一----jQuery開始 jQuery整理笔记二----jQuery选择器整理 jQuery整理笔记三----jQuery过滤函数 jQuery整理笔 ...

  2. jQuery整理笔记七----几个经典表单应用

    1.文本框获得(失去)焦点 当文本框获得输入焦点时,将该文本框高亮显示,算不得一个应用,仅仅是一个小技巧,能够提高用户体验. <!DOCTYPE html PUBLIC "-//W3C ...

  3. jQuery学习笔记之jQuery的Ajax（3）

    jQuery学习笔记之jQuery的Ajax(3) 6.jQuery的Ajax插件 源码地址: https://github.com/iyun/jQueryDemo.git ------------- ...

  4. jQuery 学习笔记：jQuery 代码结构

    jQuery 学习笔记:jQuery 代码结构 这是我学习 jQuery 过程中整理的笔记,这一部分主要包括 jQuery 的代码最外层的结构,写出来整理自己的学习成果,有错误欢迎指出. jQuery ...

  5. jQuery:自学笔记(2)——jQuery选择器

    jQuery:自学笔记(2)——jQuery选择器 基本选择器 说明 jQuery的基本选择器与CSS的选择器相似: 实例 标签选择器 //使用标签选择器更改字体大小 $(div).css('font ...

  6. jQuery整理笔记9----函数形式发展

    在一些照片中使用演示样本.插入.样式文件下载:点我进入下载 过去在开发过程中关于table方面的jquery应用不过局限于使用jquery操作table添加一行.删除一列等等操作.今天整理的跟过去用的 ...

  7. jQuery整理笔记九----功能性表格开发

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/hai_cheng001/article/details/27536965 演示样例中用到的一些图片. ...

  8. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  9. jQuery整理笔记2----jQuery选择整理

    一个.基本的选择 1.ID选择器 JavaScript提供了原生方法实如今DOM中选择指定ID值得元素. 使用方法例如以下: var element=document.getElementById(& ...

随机推荐

  1. 详解Python中的生成器表达式（generator expression）

    介绍 1.生成器表达式(generator expression)也叫生成器推导式或生成器解析式,用法与列表推导式非常相似,在形式上生成器推导式使用圆括号(parentheses)作为定界符,而不是列 ...

  2. Hello Ragel -- 生成状态机的神器

    Ragel 是个很 NB 的能生成状态机的编译器,而且支持一堆语言:C.C++.Object-C.C#.D.Java.Go 以及 Ruby. 原来的文本解析器是用正则表达式实现的,随着状态(if-el ...

  3. 读取Properties配置文件， 四种方式都可以得到webroot/WEB-INF/classes这个路径

    下面四种方式都可以得到webroot/WEB-INF/classes这个路径,有什么区别,哪种方式最好? String path = this.getClass().getResource(" ...

  4. WIN7怎样把屏幕改为16位色

    1 右击桌面,选择屏幕分辨率   2 选择高级设置   3 点击"监视器"选项卡,把颜色改为16位.   4 屏幕会暂时黑屏一段时间,随后主题将自动切换为基础版(失去Areo效果) ...

  5. PuTTY连接Linuxserver常常断线解决方式

    PuTTY在远程连接server之后.常常会断线提示"Software caused connection abort",并且常常在非常短的时间内就失去连接. 解决方式例如以下: ...

  6. Unity AssetBundle 踩坑记录

    Unity AssetBundle 踩坑记录 editor 下选择什么平台的 ab 加载 Material doesn't have a color property '_Color' UnityEd ...

  7. openerp-server.conf 中配置 dbfilter 参数无效的解决办法

    来自:http://shine-it.net/index.php/topic,14517.html 以前就发现过这个问题, 今天重新在群里同大家讨论了一下. 有时候可能我们希望用户不从登陆界面的账套选 ...

  8. Oracle，跳出游标循环

    1,跳出游标的循环,不执行遍历了. 方法一:goto for c_row in 游标 loop if 条件 then dbms_output.put_line('测试跳出循环'); goto brea ...

  9. HDU 5407(2015多校10)-CRB and Candies(组合数最小公倍数+乘法逆元)

    题目地址:pid=5407">HDU 5407 题意:CRB有n颗不同的糖果,如今他要吃掉k颗(0<=k<=n),问k取0~n的方案数的最小公倍数是多少. 思路:首先做这道 ...

  10. [DevExpress]XtraTabControl右键加入关闭当前页、关闭其它页、所有关闭的实现

    private void xtraTabControl_MouseDown(object sender, MouseEventArgs e) { if (e.Button == MouseButton ...