jQuery学习之四---Ajax请求

来源:互联网 发布:嵌入式转人工智能领域 编辑:程序博客网 时间:2024/05/16 05:20

1、$.ajax(url,[settings])
jQuery版的Ajax:是对原生XMLHttpRequest对象的封装,同时也省去了很多麻烦
当然前提是,你需要有一份JQ文件,可以自己去官网上去下载一份。
点击这个网址:JQ文件下载
其基本方法就是$.ajax(),参数是一组对象
以下是它的参数列表:

① url:请求的链接地址
② data:发送的数据,一般以对象的方式
③ dataType:返回的数据类型,默认text文本类型,一般可设置为json,jsonp,html,xml等
④ type:请求方式,get和post
⑤ async:同步还是异步,默认异步true,同步false,同步会造成页面卡顿
⑥ success:function(){},请求成功的回调函数
⑦ error:function(){},请求失败的回调函数

ok,我们来分别看看以下三种类型:
返回数据类型为JSON:不可跨域,支持get和post两种方式。
GET方式:这种方式,data的值一般可以直接拼接在url之后
这里写图片描述
POST方式:
这里写图片描述
返回数据类型为JSONP:可跨域,但是只支持get一种传达方式
这里写图片描述


2、load(url,[data],[callback])
载入远程 HTML 文件代码并插入至 DOM 中。
默认使用 GET 方式 - 传递附加参数时自动转换为 POST 方式。

url:待装入 HTML 网页网址。
data:发送至服务器的 key/value 数据。
callback:载入成功时回调函数。

比如:把一个HTML文件的内容加载插在一个p标签$("p").load("test.html");再比如:再test文件中,选择前20条加载插在p标签中,并返回插入成功的信息$("p").load("test.html",{limit:20},function(){    alert("插入成功");})

3、$.get(url,[data],[fn],[type])

 通过远程 HTTP GET 请求载入信息。这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。

参数:
url:待载入页面的URL地址
data:待发送key/value参数
callback:载入成功时回调函数
type:返回内容格式,xml,html,script,json,test,jsonp

①请求test.php网页,传送2个参数,忽略返回值$.get("test.php",{name:"pingzi",date:"2017"});②请求网页,传递参数,并返回载入成功的函数$.get("test.cgi", { name: "John", time: "2pm" },function(data){    alert(data);});

4、$.post(url,[data],[fn],[type])

用法与$.get()一样,在此不再赘述。


5、$.getJSON(url,[data],[fn])

通过 HTTP GET 请求载入 JSON 数据。
在 jQuery 1.2 中,您可以通过使用JSONP形式的回调函数来加载其他网域的JSON数据,如 “myurl?callback=?”。jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

6、 $.getScript(url,[callback])
通过 HTTP GET 请求载入并执行一个 JavaScript 文件。

$.getScript("test.js", function(){  alert("加载完毕");});

7、ajaxComplete(callback)
AJAX 请求完成时执行函数。Ajax 事件。
8、 ajaxError(callback)
AJAX 请求发生错误时执行函数。Ajax 事件。
9、ajaxSend(callback)
AJAX 请求发送前执行函数。Ajax 事件。
10、ajaxStart(callback)
AJAX 请求开始时执行函数。Ajax 事件。
11、 ajaxStop(callback)
AJAX 请求结束时执行函数。Ajax 事件。
12、ajaxSuccess(callback)
AJAX 请求成功时执行函数。Ajax 事件。