English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
$.ajax() 메서드를 사용하여 비동기 HTTP(Ajax) 요청을 실행합니다。
$.ajax() 메서드는 jQuery가 전송하는 모든 Ajax 요청의 기본입니다. 일반적으로 이 메서드를 직접 호출할 필요는 없으며, 다음과 같이 사용할 수 있습니다：$.get()，$.post()와load()또는 몇 가지 더 고급한 대체 메서드가 있으며 사용하기가 더 쉽습니다. 하지만, 일반적으로 사용하는 옵션들이 적을 때는 $.ajax()를 더 유연하게 사용할 수 있습니다。
문법 1：1.5+버전：
$.ajax(url, {name:value, name:value, ...})문법 2 ：1.0+버전：
$.ajax(name:value, name:value, ...)
사용추가의 AJAX 요청버전DIV 요소의 텍스트를 변경합니다：1.5버전：
$.ajax("ajax_intro.txt", {success: function(response){
$("div").html(response);
});테스트를 보세요‹/›사용추가의 AJAX 요청버전DIV 요소의 텍스트를 변경합니다：1.0버전：
$.ajax({
url: "ajax_intro.txt",
success: function(response){
$("div").html(response);
}
});테스트를 보세요‹/›ajax_get.php 페이지를 요청하고 다른 데이터를 보냅니다：
$.ajax({
url: "ajax_get.php",
data: {fname:"Seagull", lname:"Anna"},
success: function(response){
$("div").html(response);
}
});테스트를 보세요‹/›ajax_get.php 페이지를 요청하고 다른 데이터를 보내고 상태 메시지를 알림합니다：
$.ajax({
url: "ajax_get.php",
data: {fname:"Seagull", lname:"Anna"},
success: function(response, status){
$("div").html(response);
alert(status);
}
});테스트를 보세요‹/›HTTP POST 메서드를 사용하여 ajax_post.php 페이지를 요청합니다：
$.ajax({
url: "ajax_post.php",
method: "POST",
success: function(response){
$("div").html(response);
}
});테스트를 보세요‹/›비동기 설정을 사용하여 동기 요청을 지정합니다：
$.ajax({
url: "ajax_get.php",
async: false,
data: {fname:"Seagull", lname:"Anna"},
success: function(response){
$("div").html(response);
}
});테스트를 보세요‹/›dataType 설정을 사용하여 요청하는 데이터 유형을 지정합니다：
$.ajax({
url: ""/javascript/myscript.js",
dataType: "script"
});테스트를 보세요‹/›Ajax 요청이 오류가 발생하면 알림을 표시합니다：
$.ajax({
url: "wrong_file.html",
success: function(response){
$("div").html(response);
},
error: function(xhr){
$("div").html("에러가 발생했습니다: " + xhr.status + " " + xhr.statusText);
}
});테스트를 보세요‹/›파일을 요청하고 완료되면 사용자에게 알림을 보냅니다. 요청이 실패하면 다음과 같은 알림을 표시합니다：
let request = $.ajax({
url: "ajax_get.php",
data: {fname:"Seagull", lname:"Anna"}
});
request.done(function(msg){
$("div").html(msg);
});
request.fail(function(xhr, textStatus){
$("div").html("요청 실패: "} + textStatus);
});테스트를 보세요‹/›AJAX 요청에 name:value 쌍을 하나 이상 지정하는 매개변수
가능한 이름: 아래 표의 값:
| 이름 | 값 타입 | 설명 |
|---|---|---|
| async | 부울형 | 요청을 동기적으로 처리할지 지정하는 부울 값. 기본值为 true |
| beforeSend(xhr) | 함수 | 요청을 보내기 전에 실행할 함수 |
| cache | 부울형 | 브라우저가 요청의 페이지를 캐시에 저장할지 지정하는 부울 값. 기본值为 true |
| complete(xhr, status) | 함수 | 요청이 완료되면 실행할 함수(성공 및 오류 함수 이후) |
| contentType | 부울 값 또는 문자열 | 데이터를 서버로 보내는 데 사용할 내용 유형. 기본值为 "application" / x-www-form-urlencoded |
| context | 일반 객체 | 모든 AJAX와 관련된 콜백 함수에 "this" 값을 지정합니다. |
| data | PlainObject 또는 String 또는 Array | 서버로 보내야 할 데이터를 지정합니다. |
| dataFilter(data,type) | 함수 | XMLHttpRequest의 원시 응답 데이터를 처리하는 함수 |
| dataType | 문자열 | 서버가 예상하는 데이터 타입 |
| error(xhr, status, error) | 함수 | 요청이 실패할 때 실행되는 함수 |
| global | 부울형 | 요청이 전체 AJAX 이벤트 핸들러를 트리거할지 지정하는 부울 값. 기본值为 true |
| ifModified | 부울형 | 이전 요청 이후에 응답이 변경되었을 때만 요청이 성공하는지 지정하는 부울 값. 기본值为 false. |
| jsonp | 문자열 또는 부울 | jsonp 요청의 콜백 함수를 덮어씁니다. |
| jsonpCallback | 함수 | jsonp 요청의 콜백 함수의 이름을 지정합니다. |
| method | 문자열 | 요청에 사용할 HTTP 메서드를 지정합니다. (GET 또는 POST). 기본值为 GET |
| password | 문자열 | HTTP 접근 인증 요청에서 사용할 비밀번호를 지정합니다. |
| processData | 부울형 | 데이터를 요청과 함께 전송할 때 데이터를 쿼리 문자열로 변환할지 지정하는 부울 값. 기본值为 true |
| scriptCharset | 문자열 | 요청의 문자 집합을 지정 |
| statusCode | 일반 객체 | 응답이 해당 코드를 가지고 있을 때 HTTP 코드와 함수를 호출하는 객체$.ajax({
statusCode:{
404:function(){
alert('페이지를 찾을 수 없습니다.');
}
}
}) |
| success(response,status,xhr) | 함수 | 요청이 성공할 때 실행할 함수 |
| timeout | 숫자 | 요청의 로컬 타임아웃(밀리초 단위) |
| traditional | 부울형 | 트리플 데스크 패러미터 시리얼라이제이션 스타일을 사용할지 여부를 지정하는 부울 값입니다 |
| type | 문자열 | method의 별명입니다. 만약1.9jQuery 0.0 이전 버전에서는 type을 사용해야 합니다 |
| url | 문자열 | 요청을 보낼 URL을 지정합니다. 기본적으로 현재 페이지입니다 |
| username | 문자열 | HTTP 접근 인증 요청에서 사용할 사용자 이름을 지정 |
| xhr | 함수 | XMLHttpRequest 객체를 생성하는 함수 |