jQuery发送Ajax的请求

文献种类：专题技术总结文献

开发工具与关键技术：   jQuery发送Ajax的请求                     

作者：吴锦华      ；年级：20级    ；撰写时间：2021   年 5  月  25日

文献编号：                归档时间：   年   月   日

jQuery发送Ajax的请求

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术：jQuery发送Ajax的请求

作者：吴锦华

撰写时间：2021/5/25

概述

 

Ajax用于浏览器与服务器通信而无需刷新整个页面，服务器将不再返回整个页面，而是返回少量数据，通过JavaScript DOM更新一部分节点。期间数据传输可采用xml，json等格式，Ajax最早用于谷歌的搜索提示。

 

其实不刷新整个页面便可与服务器通信的方法有很多，比如Flash，Java applet，iframe等，但Ajax是目前最为常见的一种。

 

我们可以使用JavaScript扩展对象XMLHttpRequest实现Ajax，对于这种方法在这里不做介绍，下面直接了解jQuery实现Ajax的几种方法。

 

$.ajax()

 

该方法用于执行Ajax请求，常用于其他jQuery Ajax方法不能完成的请求，也许我们可以把它称为"jQuery中Ajax系列方法之母"。

 

形式：$.ajax({name:val, name:val,...});

可选字段：

1）url：链接地址，字符串表示

2）data：需发送到服务器的数据，GET与POST都可以，格式为{A: '...', B: '...'}

3）type："POST" 或 "GET"，请求类型

4）timeout：请求超时时间，单位为毫秒，数值表示

5）cache：是否缓存请求结果，bool表示

6）contentType：内容类型，默认为"application/x-www-form-urlencoded"

7）dataType：服务器响应的数据类型，字符串表示；当填写为json时，回调函数中无需再对数据反序列化为json

8）success：请求成功后，服务器回调的函数

9）error：请求失败后，服务器回调的函数

10）complete：请求完成后调用的函数，无论请求是成功还是失败，都会调用该函数；如果设置了success与error函数，则该函数在它们之后被调用

11）async：是否异步处理，bool表示，默认为true；设置该值为false后，JS不会向下执行，而是原地等待服务器返回数据，并完成相应的回调函数后，再向下执行

12）username：访问认证请求中携带的用户名，字符串表示

13）password：返回认证请求中携带的密码，字符串表示

不知道将最后两个放到data中去，是不是密码会以明文展示，因没有尝试过，这里不敢下结论。

 

比如举个例子：

 

 

$.post()

 

 

 

该方法使用POST方式执行Ajax请求，从服务器加载数据。

 

形式：$.post(url, data, func, dataType);

可选参数：

1）url：链接地址，字符串表示

2）data：需要发送到服务器的数据，格式为{A: '...', B: '...'}

3）func：请求成功后，服务器回调的函数；function(data, status, xhr)，其中data为服务器回传的数据，status为响应状态，xhr为XMLHttpRequest对象，个人感觉关注data参数即可

4）dataType：服务器返回数据的格式

 

上面三个是jQuery中发送Ajax请求较为重要的方法，下面再选择三个较为常见的方法，简单做解释。

 

$.getJSON()

 

该方法使用GET方式执行Ajax请求，从服务器加载JSON格式数据。

 

形式：$.getJSON(url, data, func);

 

因为确定服务器返回json编码的数据，故相较于$.get()不必再指定dataType。

 

 

$.load()

 

该方法将服务器加载的数据直接插入到指定DOM中。

 

形式：$.load(url, data, func);

 

其中data如果存在则使用POST方式发送请求，不存在则使用GET方式发送请求。

$.getScript()

该方法使用GET方式执行Ajax请求，从服务器加载并执行回传的JavaScript。

 

形式：$.load(url, func);

 

 

这是jQuery发送Ajax的请求,希望能帮助到你们

新手上道，请多多指教。