/**
* jQuery 를 이용한 Ajax 호출 샘플 코드
* 보통 함수에 Ajax 실행 함수를 넣어놓고 호출하여 사용합니다.
* 아래 Ajax 속성값을 이용하여 사용합니다.
* 필수 사용 : typr, url, dataType success
* 필수 JS 파일 : common.js (jQuery 라이브러리 파일)
*/
$.ajax({ // 실행 함수
type:"POST", // get.post 가능
url:"ajax.jsp", // 호출 url
dataType: "json", //date 타입 xml,text 등
data:"point=1&gift=2", // url 에 보낼 파라미터 값
timeout:3000, //제한시간 설정 가능
cache:false, // true, false
error:function(request, status, error){ // 에러 발생 시 status 400 이 성공 그 외 404, 500 등
alert("에러!");
},
success:function(msg){ // 성공 시 콜백 msg 에 data
alert("성공");
},
beforeSend:function(){ // ajax 통신을 시작하기 전에 콜백
alert("통신시작");
},
complete:function(){ //완료 후 실행할 콜백 함수 정의
alert("통신완료");
}
});
/**
* 상황에 따라 적절하게 함수 사용 아래 상황 예제 샘플
*/
// html document 완성 시 onload 와 유사함
jQuery(document).ready(function(){
$.ajax({
type:"GET",
url:"ajax.jsp",
data:param,
success:function(msg){
view_area.innerHTML = msg;
}
});
});
// 엘리먼트 클릭 등 dom 의 변화에 따른 이벤트 id , class 등 지정 가능
$(function() {
$('.divId').click(function() { // function 으로 감싸지 않고 아래의 예제처럼도 사용가능
});
});
// form submit 시 콜백 id, class 등 지정
$("formName").submit(function(){
});
// 함수 호출을 통한 ajax
function dom_start(_cnt1,_cnt2){
$.ajax({
type:"POST",
url:"ajax.jsp",
data:param,
success:function(msg){
view_area.innerHTML = msg;
}
});
}
'jQuery' 카테고리의 다른 글
jQuery json load (0) | 2012.01.10 |
---|---|
jquery 정리 (0) | 2011.12.26 |
jQuery 커버플로우 (0) | 2011.07.29 |
jQuery 유용한 함수(?) eq (0) | 2011.06.23 |
jQuery 애니메이션 메뉴 펼치기 접기 (0) | 2011.06.23 |