jQuery 에서 ajax 와 ajaxStart 사용법 > 개발

• 목록

• 페이스북 공유
• 트위터 공유

```
function data_fetch(wr_id) {
$.ajax({
url : "/path/ajax.php"
, type: 'get'
, dataType: 'html'
, data : "kind_cd=" + kind_cd + "&file_no=" + file_no
, success : function(html) {
alert(html);
location.reload();
}
, error: function(xhr,xmlStatus) {
alert("오류 발생.\n\n" + xhr.statusText + "\n\n" + xhr.responseText);
return;
}
});
}

$(document).ajaxStart(function() {
$("#loading").show();
});

$(function() {
console.log( "ready!" );
});
```



## Ajax 메소드

메소드 설명
$.ajax() 비동기식 Ajax를 이용하여 HTTP 요청을 전송함.
$.get() 전달받은 주소로 GET 방식의 HTTP 요청을 전송함.
$.post() 전달받은 주소로 POST 방식의 HTTP 요청을 전송함.
$.getScript() 웹 페이지에 스크립트를 추가함.
$.getJSON() 전달받은 주소로 GET 방식의 HTTP 요청을 전송하여, 응답으로 JSON 파일을 전송받음.
.load() 서버에서 데이터를 읽은 후, 읽어 들인 HTML 코드를 선택한 요소에 배치함.

따라서, 서버에서 html 을 불러와서 DOM 요소에 배치하는 코드에는 .load() 가 적합하다.



## ajax 로 동적으로 추가된 요소에 이벤트 부여하기
```
// .live method - legacy
$(document).ready(function(){
  $("#id, .cls").live("click", eventFunction);
});
 
// .on method
$(document).on("click", "#id, .cls", eventFunction);
```



## 참고
https://araikuma.tistory.com/640
http://blog.freezner.com/archives/411

추천0