jquery 비 동기 통신 $.ajax(), $.get(), $.post() 사용방법

$.ajax() 사용방법

비동기 요청 시 사용하는 $.ajax()

$.ajax({
    url: 'example.php' // 요청 할 주소
    async: true, // false 일 경우 동기 요청으로 변경
    type: 'POST' // GET, PUT
    data: {
        Name: 'ajax',
        Age: '10'
    }, // 전송할 데이터
    dataType: 'text', // xml, json, script, html
    beforeSend: function(jqXHR) {}, // 서버 요청 전 호출 되는 함수 return false; 일 경우 요청 중단
    success: function(jqXHR) {}, // 요청 완료 시
    error: function(jqXHR) {}, // 요청 실패.
    complete: function(jqXHR) {} // 요청의 실패, 성공과 상관 없이 완료 될 경우 호출
});

 

 

$.get() 사용방법

HTTP GET 요청을 하여 서버로부터 데이터를 로드 한다.

$.get( "example.php?Name=ajax&Age=10", function(jqXHR) {
    alert( "success" );
}, 'json' /* xml, text, script, html */)
.done(function(jqXHR) {
    alert( "second success" );
})
.fail(function(jqXHR) {
    alert( "error" );
})
.always(function(jqXHR) {
    alert( "finished" );
});​

 

$.post() 사용방법

HTTP POST 요청을 하여 서버로부터 데이터를 로드 한다.

전송할 데이터를 정의하는 부분을 제외하고 $.get() 방식과 동일하다.

$.post( "example.php?Name=ajax&Age=10", {
    Name: 'ajax',
    Age: '10'
}, function(jqXHR) {
    alert( "success" );
}, 'json' /* xml, text, script, html */)
.done(function(jqXHR) {
    alert( "second success" );
})
.fail(function(jqXHR) {
    alert( "error" );
})
.always(function(jqXHR) {
    alert( "finished" );
});