각 Jquery Ajax 함수의 자세한 해석:
$.get(), $.post(), $.ajax(), $.getJSON()
1, $.get(url,[data],[콜백])
설명: url은 요청 주소, data는 요청된 데이터 목록, callback은 요청 성공 후의 콜백 함수입니다. 이 함수는 두 개의 매개변수를 받습니다. 첫 번째는 서버에서 반환되는 데이터이고 두 번째는입니다. 매개변수는 서버의 상태이며 선택적 매개변수입니다.
그 중 서버에서 반환하는 데이터의 형식은 실제로는 문자열 형식으로, 이는 우리가 원하는 json 데이터 형식이 아니며 단지 비교 및 설명을 위해 인용한 것입니다
$("#getResponse").html(data) }//반환된 데이터는 문자열 유형입니다
);
설명: 이 함수는 $.get() 매개변수와 유사하며 추가 유형 매개변수는 html, xml, json 등이 될 수 있는 요청된 데이터 유형입니다. 이 매개변수를 json으로 설정하면 , 형식은 json 형식입니다. 설정되지 않은 경우 $.get()에서 반환된 형식과 동일하며 문자열
},"json"//얻는 데이터의 형식이 설정되어 있으므로, 얻는 데이터 형식은 json 형식입니다
);
데이터:{전체:"fu"},
유형: "POST",
데이터 유형:'json',
성공:콜백,
오류:기능(er){
뒤로Err(er);}
});
호출 시 jsonData.id 메서드를 사용해야 합니다
정적 페이지 로드
load( url, [data], [callback] );url (String) 요청된 HTML 페이지의 URL 주소
data (Map) (선택적 매개변수) 서버로 전송되는 키/값 데이터
콜백(Callback)(선택적 매개변수) 요청 완료 시 콜백 함수(성공할 필요는 없음)
get( url, [data], [callback] )
url(String) 요청을 보낼 URL 주소.
data(Map)(선택 매개변수) 서버로 보낼 데이터, with Key/ value의 키-값 쌍 형식은 로드가 성공할 때 QueryString
콜백(Callback)(선택적 매개변수) 콜백 함수로 요청 URL에 추가됩니다(이 메소드는 Response의 반환 상태가 다음인 경우에만 호출됩니다). 성공)
분명히 이것은 GET 메소드를 구체적으로 구현한 함수이고 사용이 매우 간단합니다.
url(문자열) 요청을 보낼 URL 주소입니다.
data(Map)(선택적 매개변수) 서버로 보낼 데이터로, 키/값 쌍의 형태로 표현됩니다.
callback(콜백) (선택변수) 로딩 성공 시 콜백 함수(Response의 반환 상태가 성공인 경우에만 호출되는 메소드)
type (String) (선택변수) 요청한 데이터의 종류, xml, text, json 등
역시 jQuery에서 제공하는 간단한 함수입니다. 사용법은
getScript( url, [callback] )
url(String) 로드할 JS 파일 주소
callback(함수)(선택) 로드 성공 후 콜백 함수
getScript() 함수는 JavaScript 스크립트를 원격으로 로드하고 실행할 수 있습니다. 이 기능은 여러 도메인에 걸쳐 JS 파일을 로드할 수 있습니다(마법...?!). 이 기능은 페이지 초기화 시 해당 JS 파일을 모두 로드하는 대신 사용자 상호작용을 기반으로 해당 JS 파일을 로드할 수 있기 때문에 페이지 초기 로드 시 코드 양을 크게 줄일 수 있다는 점에서 매우 중요합니다.
getJSON(url,[data],[callback])
url(String) 요청 주소 전송
data(Map)(선택) 전송할 키/값 매개변수
콜백(함수) ( 선택사항) 로딩 성공 시 콜백 함수.
JSON은 이상적인 데이터 전송 형식으로 JavaScript나 다른 호스트 언어와 잘 통합될 수 있으며 JS에서 직접 사용할 수 있습니다. JSON을 사용하는 것은 전통적인 GET 및 POST를 통해 직접 "누드" 데이터를 보내는 것보다 구조적으로 더 합리적이고 안전합니다. jQuery의 getJSON() 함수는 JSON 매개변수가 설정된 ajax() 함수의 단순화된 버전일 뿐입니다. 이 함수는 도메인 전반에 걸쳐 사용할 수도 있으며 get() 및 post()에 비해 몇 가지 장점이 있습니다. 또한 이 함수는 요청 URL을 "myurl?callback=X" 형식으로 작성하여 프로그램이 콜백 함수 X를 실행하도록 할 수 있습니다.
ajax( options )
ajax()提供了一大票参数,所以可以实现相当复杂的功能。
参数名 | 类型 | 描述 |
url | String | (默认: 当前页地址) 发送请求的地址。 |
type | String | (默认: “GET”) 请求方式 (“POST” 或 “GET”), 默认为 “GET”。 注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。 |
timeout | Number | 设置请求超时时间(毫秒)。此设置将覆盖全局设置。 |
async | Boolean | (默认: true) 默认设置下,所有请求均为异步请求。 如果需要发送同步请求,请将此选项设置为 false。 注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。 |
beforeSend | Function | 发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头。 XMLHttpRequest 对象是唯一的参数。 function (XMLHttpRequest) { this; // the options for this ajax request } function (XMLHttpRequest) { this; // the options for this ajax request } |
cache | Boolean | (默认: true) jQuery 1.2 新功能,设置为 false 将不会从浏览器缓存中加载请求信息。 |
complete | Function | 请求完成后回调函数 (请求成功或失败时均调用)。 参数: XMLHttpRequest 对象,成功信息字符串。 function (XMLHttpRequest, textStatus) { this; // the options for this ajax request } function (XMLHttpRequest, textStatus) { this; // the options for this ajax request } |
contentType | String | (默认: “application/x-www-form-urlencoded”) 发送信息至服务器时内容编码类型。默认值适合大多数应用场合。 |
data | Object, String |
发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。 查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。 如果为数组,jQuery 将自动为不同值对应同一个名称。 如 {foo:["bar1", "bar2"]} 转换为 ‘&foo=bar1&foo=bar2′。 |
dataType | String | 预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息 返回 responseXML 或 responseText,并作为回调函数参数传递,可用值: “xml”: 返回 XML 文档,可用 jQuery 处理。 “html”: 返回纯文本 HTML 信息;包含 script 元素。 “script”: 返回纯文本 JavaScript 代码。不会自动缓存结果。 “json”: 返回 JSON 数据 。 “jsonp”: JSONP 格式。使用 JSONP 形式调用函数时, 如 “myurl?callback=?” jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。 |
error | Function | (默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。
这个方法有三个参数:XMLHttpRequest 对象,错误信息,(可能)捕获的错误对象。 function (XMLHttpRequest, textStatus, errorThrown) { // 通常情况下textStatus和errorThown只有其中一个有值 this; // the options for this ajax request } function (XMLHttpRequest, textStatus, errorThrown) { // 通常情况下textStatus和errorThown只有其中一个有值 this; // the options for this ajax request } |
global | Boolean | (默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件,
如 ajaxStart 或 ajaxStop 。可用于控制不同的Ajax事件 |
ifModified | Boolean | (默认: false) 仅在服务器数据改变时获取新数据。
使用 HTTP 包 Last-Modified 头信息判断。 |
processData | Boolean | (默认: true) 默认情况下,发送的数据将被转换为对象(技术上讲并非字符串)
以配合默认内容类型 “application/x-www-form-urlencoded”。 如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。 |
success | Function |
请求成功后回调函数。这个方法有两个参数:服务器返回数据,返回状态 function (data, textStatus) { // data could be xmlDoc, jsonObj, html, text, etc... this; // the options for this ajax request } function (data, textStatus) { // data could be xmlDoc, jsonObj, html, text, etc... this; // the options for this ajax request } |
데이터 유형으로 xml, script, html, json을 지정할 수 있으며 beforeSend, 오류, 성공, 완료 및 기타 상태에 대한 처리 기능을 설정할 수 있으며, 다른 많은 매개변수도 사용자 정의하여 사용자의 Ajax 경험을 완벽하게 정의할 수 있습니다. . 다음 예에서는 ajax()를 사용하여 XML 문서를 호출합니다.
(글로벌 이벤트) 요청이 시작되기 전에 트리거되는 전역 이벤트
성공
(로컬 이벤트)은 요청이 성공할 때 트리거됩니다. 즉, 서버는 오류를 반환하지 않으며, 반환된 데이터에는 오류가 없습니다.
ajaxSuccess
글로벌 이벤트 글로벌 요청 성공
오류
(로컬 이벤트)는 오류가 발생한 경우에만 발생합니다. 성공 및 오류 콜백 함수를 동시에 실행할 수 없습니다.
ajaxError
전역 이벤트 오류가 발생하면 전역 이벤트가 트리거됩니다.
complete
(로컬 이벤트) 요청이 성공하든 실패하든 상관없습니다. 동기식 요청인 경우 요청이 완료되면 이 이벤트가 트리거될 수 있습니다.
ajaxComplete
글로벌 이벤트 요청이 완료되면 글로벌 이벤트가 트리거됩니다.
ajaxStop
(글로벌 이벤트) Ajax가 진행 중이고,
로컬 이벤트가 발생합니다. 이전 함수에서 소개한 내용인데, 주로 글로벌 이벤트를 살펴보겠습니다. 개체에 대해 전역 이벤트 모니터링이 수행되면 전 세계의 모든 AJAX 작업이 해당 개체에 영향을 미칩니다. 예를 들어, 페이지가 AJAX 작업을 수행하는 경우 ID가 "loading"인 DIV가 표시됩니다.
코드 복사
val()
val()函数可以返回表单组建的值,例如任何种类input的值。配合选择符操作,你可以轻易获取选项组、输入框、按钮等元素的值。
serialize函数可以帮你把表单对象的所有值都转换为字符串序列。如果你要写GET格式的请求,这个就非常方便了。
serializeArray()和serialize()类似,只不过它返回的是JSON对象。