ajax 및 jQuery 기반 부분 리 셋 프로 세 스 분석

1.jQurey 사용 시 jquery-1.4.2.js 를 웹 폴 더 에 가 져 와 야 합 니 다.
그리고 script 을 쓸 때 다음 과 같이 script 라벨 을 정의 해 야 합 니 다.<script src="js/jquery-1.4.2.js" type="text/javascript"></script>2.jQurey 의 문법:$(선택 할 요소)를 통 해

ajax 에 응답 하 는 Servlet 정의

String buttonName=request.getParameter("buttonName");
  JSONObject jsObject =null;  //           
  if (buttonName.equals("button_1")){
   jsObject=new JSONObject("{first:\"  \",second:\"  \",third:\"  \"}"); //        

  }
  if (buttonName.equals("button_2")){
   jsObject=new JSONObject("{first:\"  \",second:\"  \",third:\"  \"}");

  }
  if (buttonName.equals("button_3")){
   jsObject=new JSONObject("{first:\"  \",second:\"  \",third:\"  \"}");

  }
  response.getOutputStream().write(jsObject.toString().getBytes("utf-8")); //  respon.getOutputStream           jsp  
 }
ajax 사용 형식 은 다음 과 같 습 니 다:

$.ajax({
  url:"/AJAX_war_exploded/ClickServlet", //      Servlet
  type:"post",                //       
  data:{                   //        ,        
   buttonName:"button_2"
  },                     //  ajax   Servlet      
  dataType:"json",             //         
  success:function(result){       //ajax              success
   var first=result.first;
   var second=result.second;
   var third=result.third;
   $(".first")[0].innerHTML=first;    //      jQuery  html  
   $(".second")[0].innerHTML=second;
   $(".third")[0].innerHTML=third;
  }
  })
 })
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기