[ajax 코딩하기] 간단한 ajax 사용하기

■ javascript library 없이 ajax 사용하기  //ajax 객체 생성 function getAjaxHttp(){     var xmlhttp;     if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari         xmlhttp=new XMLHttpRequest();     }else{// code for IE6, IE5         xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");     }           return xmlhttp; }   //데이터 요청 보내기 //요건 ajax객체와 호출한 곳에서 넘겨준 콜백 메소드를 재호출해 준다. //간단하게 정수타입을 반환해서 쓰면 utf8 필요없다. function requestAjaxData(ajax, method, url, callback){     ajax.onreadystatechange = function(){         if(ajax.readyState==4 && ajax.status==200) eval!(callback)(ajax);     }           ajax.open(method,url,true);     ajax.send(); }   //ajax작업처리 function callAjax(method, url, callback){     var ajax = getAjaxHttp();     if(ajax==null){alert!("ajax변수 세팅안됨");return;}       requestAjaxData(ajax, method, url, callback); }

호출은 요렇게

callAjax("GET","/url/sample.asp?p=v","callbackmethod");

//리턴값은 여기서 받고

function callbackmethod(ajax){

    alert!(ajax.responseText);

}

[출처] http://findfun.tistory.com/7 

 

■ jquery ajax 사용하기

function 함수명(){
     var url = "요청할 URL.do";
     var myAjax = new Ajax.Request(   //ajax 요청할 객체 생성
      url,
      {
         method: 'get',
         asynchronous: false,   // 비동기 통신을 하겠다는 뜻
         onComplete: set_popup_div 

          //요청후 데이터를 가지고 온 후에 호출할 함수(가져온 데이터 가공을 위해)
       }); 
      var p_left = getposOffset($('king3image'),'left') + 143;
      var p_top = getposOffset($('king3image'),'top') - 22;
      $("popup_div").setStyle({
                   'left': p_left +'px', 'top': p_top +'px'
      });
 }

function set_popup_div(request){
  var result = request.responseText;
  if(result.length > 5) {
   $("popup_div").style.visibility = "visible";
   $("popup_div").update( result );
  }
 }