>웹 프론트엔드 >JS 튜토리얼 >Jquery에서 Ajax 요청을 구현하는 방법에 대한 자세한 설명

Jquery에서 Ajax 요청을 구현하는 방법에 대한 자세한 설명

伊谢尔伦
伊谢尔伦원래의
2017-06-19 09:38:081538검색

Ajax 요청

jQuery.ajax(options)

HTTP 요청을 통해 원격 데이터를 로드합니다. jQuery 기본 AJAX 구현. 간단하고 사용하기 쉬운 상위 수준 구현은 .get, .post 등을 참조하세요.

.ajax()는 생성된 XMLHttpRequest 객체를 반환합니다. 대부분의 경우 이 개체를 직접 조작할 필요는 없지만 특별한 경우에는 요청을 수동으로 종료하는 데 사용할 수 있습니다. .ajax()에는 각 구성 및 콜백 함수 정보를 포함하는 매개변수 키/값 객체라는 하나의 매개변수만 있습니다. 아래의 자세한 매개변수 옵션을 참조하세요.

참고: dataType 옵션을 지정하는 경우 서버가 올바른 MIME 정보를 반환하는지 확인하세요(예: xml은 "text/xml"을 반환함). 잘못된 MIME 유형은 예측할 수 없는 오류를 일으킬 수 있습니다.

참고: dataType이 "script"로 설정된 경우 원격 요청 중에(동일한 도메인에 속하지 않음) 모든 POST 요청이 GET 요청으로 변환됩니다. (DOM 스크립트 태그를 사용하여 로드하므로)

jQuery 1.2에서는 도메인 간에 JSON 데이터를 로드할 수 있습니다. 사용 시 데이터 유형을 JSONP로 설정해야 합니다. "myurl?callback=?"과 같은 JSONP 형식을 사용하여 함수를 호출하면 jQuery는 콜백 함수를 실행하기 위해 자동으로 ?를 올바른 함수 이름으로 바꿉니다. 데이터 유형이 "jsonp"로 설정되면 jQuery는 자동으로 콜백 함수를 호출합니다.

반환 값 XMLHttpRequest

Parameters

options(선택 사항): AJAX 요청 설정. 모든 옵션은 선택 사항입니다.

Options

(1), async (Boolean): (기본값: true)
기본 설정에서는 모든 요청이 비동기 요청입니다. 동기 요청을 보내야 하는 경우 이 옵션을 false로 설정하세요. 동기 요청은 브라우저를 잠그며 사용자는 다른 작업을 수행하기 전에 요청이 완료될 때까지 기다려야 합니다.

(2) beforeSend(함수): 사용자 정의 HTTP 헤더를 추가하는 등 요청을 보내기 전에 XMLHttpRequest 객체를 수정할 수 있는 함수입니다.
XMLHttpRequest 객체가 유일한 매개변수입니다. 아약스 이벤트입니다. false가 반환되면 이 ajax 요청을 취소할 수 있습니다.

(3), 캐시(부울): (기본값: true, dataType이 스크립트인 경우 기본값은 false)
jQuery 1.2의 새로운 기능, false로 설정하면 브라우저 캐시에서 요청 정보를 로드하지 않습니다.

(4), 완료(함수): 요청이 완료된 후 콜백 함수(요청이 성공하거나 실패할 때 호출됨).
매개변수: XMLHttpRequest 객체와 성공적인 요청 유형을 설명하는 문자열. 이것은 Ajax 이벤트

(5), contentType(문자열): (기본값: "application/x-www-form-urlencoded") 서버에 정보를 보낼 때 콘텐츠 인코딩 유형입니다. 기본값은 대부분의 애플리케이션에 적합합니다.

(6), 데이터(Object,String): 서버로 전송되는 데이터입니다. 요청 문자열 형식으로 자동 변환됩니다. GET 요청의 URL에 추가됩니다. 이 자동 변환을 비활성화하려면 processData 옵션 설명을 참조하세요.
키/값 형식이어야 합니다. 배열인 경우 jQuery는 자동으로 동일한 이름을 다른 값에 할당합니다. 예를 들어, {foo:["bar1", "bar2"]}는 '&foo=bar1&foo=bar2'로 변환됩니다.

(7), dataFilter(함수): Ajax가 반환한 원본 데이터를 전처리하는 함수입니다. data와 type이라는 두 개의 매개변수를 제공합니다. data는 Ajax가 반환한 원본 데이터이고 type은 jQuery.ajax를 호출할 때 제공되는 dataType 매개변수입니다. 함수에서 반환된 값은 jQuery에 의해 추가로 처리됩니다.

(8), dataType(문자열): (기본값: xml 또는 html을 지능적으로 결정)
서버에서 반환할 것으로 예상되는 데이터 유형입니다. 지정하지 않으면 jQuery는 HTTP 패킷 MIME 정보를 기반으로 responseXML 또는 responseText를 자동으로 반환하고 이를 콜백 함수 매개변수로 전달합니다. 사용 가능한 값:

"xml": jQuery에서 처리할 수 있는 XML 문서를 반환합니다.
"html": 일반 텍스트 HTML 정보를 반환합니다. 포함된 스크립트 태그는 DOM에 삽입될 때 실행됩니다.
"script": 일반 텍스트 JavaScript 코드를 반환합니다. 결과는 자동으로 캐시되지 않습니다. "cache" 매개변수가 설정되지 않은 경우. 참고: 원격 요청(동일한 도메인 아래가 아님)을 수행하는 경우 모든 POST 요청은 GET 요청으로 변환됩니다. (DOM 스크립트 태그를 사용하여 로드하므로)
"json": JSON 데이터를 반환합니다.
"jsonp": JSONP 형식. "myurl?callback=?"과 같은 JSONP 형식을 사용하여 함수를 호출하면 jQuery는 콜백 함수를 실행하기 위해 자동으로 ?를 올바른 함수 이름으로 바꿉니다.
"text": 일반 텍스트 문자열을 반환합니다

(9), 오류(기능): (기본값: 자동 판단(xml 또는 html)) 요청 실패 시 호출할 시간입니다. 세 가지 매개변수가 있습니다: XMLHttpRequest 객체, 오류 메시지 및 (선택 사항) 캡처된 오류 객체. 오류가 발생하면 오류 메시지(두 번째 매개변수)에는 null 외에 "timeout", "error", "notmodified" 및 "parsererror"가 포함될 수 있습니다. 아약스 이벤트.

(10), global (Boolean): (기본값: true) 전역 AJAX 이벤트를 트리거할지 여부입니다. false로 설정하면 다양한 Ajax 이벤트를 제어하는 ​​데 사용할 수 있는 ajaxStart 또는 ajaxStop과 같은 전역 AJAX 이벤트가 트리거되지 않습니다.

(11), ifModified (Boolean): (기본값: false) 서버 데이터가 변경될 때만 새 데이터를 가져옵니다. HTTP 패킷의 Last-Modified 헤더 정보를 사용하여 결정합니다.

(12), jsonp(String): jsonp 요청에서 콜백 함수의 이름을 다시 작성합니다. 이 값은 "callback=?"과 같은 GET 또는 POST 요청에서 URL 매개변수의 "콜백" 부분을 대체하는 데 사용됩니다. 예를 들어, {jsonp:'onJsonPLoad'}는 "onJsonPLoad=?"로 전달됩니다. 서버.

(13), 비밀번호(String): HTTP 접근 인증 요청에 응답하는 데 사용되는 비밀번호

(14), processData(Boolean): (기본값: true) 기본적으로 전송된 데이터는 객체(기술)로 변환됩니다. (문자열 아님) 기본 콘텐츠 유형 "application/x-www-form-urlencoded"와 일치합니다. 변환하고 싶지 않은 DOM 트리 정보나 기타 정보를 보내려면 false로 설정하세요.

(15), scriptCharset(String): 요청 시 dataType이 "jsonp" 또는 "script"이고 유형이 "GET"인 경우에만 문자 세트를 강제로 수정하는 데 사용됩니다. 일반적으로 로컬 및 원격 콘텐츠 인코딩이 다를 때 사용됩니다.

(16), 성공(함수): 요청 성공 후 콜백 함수입니다. 매개변수: 서버에서 반환하고 dataType 매개변수에 따라 처리되는 데이터입니다. 상태를 설명하는 문자열입니다. 아약스 이벤트.

(17), timeout(숫자): 요청 시간 제한(밀리초)을 설정합니다. 이 설정은 전역 설정보다 우선 적용됩니다.

(18), 유형(문자열): (기본값: "GET") 요청 방법("POST" 또는 "GET"), 기본값은 "GET"입니다. 참고: PUT 및 DELETE와 같은 다른 HTTP 요청 방법도 사용할 수 있지만 일부 브라우저에서만 지원됩니다.

(19), url (String): (기본값: 현재 페이지 주소) 요청을 보낼 주소입니다.

(20), 사용자 이름(문자열): HTTP 액세스 인증 요청에 응답하는 데 사용되는 사용자 이름

(21), xhr(함수): XMLHttpRequest 객체를 반환해야 합니다. 기본값은 IE에서는 ActiveXObject이고 다른 경우에는 XMLHttpRequest입니다. 향상된 XMLHttpRequest 객체를 재정의하거나 제공하는 데 사용됩니다. 이 매개변수는 jQuery 1.3 이전에는 사용할 수 없었습니다.

jQuery.ajax() 메소드를 사용하여 데이터를 얻으세요. 코드는 다음과 같습니다:

$.ajax({
 url: "http://www.php.cn", //请求的url地址
 dataType: "json", //返回格式为json
 async: true, //请求是否异步,默认为异步,这也是ajax重要特性
 data: { "id": "value" }, //参数值
 type: "GET", //请求方式
 beforeSend: function() {
  //请求前的处理
 },
 success: function(req) {
  //请求成功时处理
 },
 complete: function() {
  //请求完成的处理
 },
 error: function() {
  //请求出错处理
 }
});

위 내용은 Jquery에서 Ajax 요청을 구현하는 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.