른록노트

[JavaScript] jquery 비 동기 통신 $.ajax(), $.get(), $.post() 사용방법 본문

Programming/[Javascript]

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

른록 2017. 8. 2. 22:46

$.ajax() 사용방법

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$.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) {} // 요청의 실패, 성공과 상관 없이 완료 될 경우 호출
});
cs


$.get() 사용방법

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


1
2
3
4
5
6
7
8
9
10
11
12
$.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" );
});
cs


$.post() 사용방법

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

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

 



참고사이트

http://webinformation.tistory.com/22


반응형
Comments