AJAX+Servlet 에서 실 현 된 데이터 처리 디 스 플레이 기능 예시

이 사례 는 AJAX+Servlet 이 실현 하 는 데이터 처리 디 스 플레이 기능 을 다 루 었 다.여러분 께 참고 하도록 공유 하 겠 습 니 다.구체 적 으로 는 다음 과 같 습 니 다.
구현 기능:입력 상자 에 문 자 를 입력 하고 AJAX 로 배경 Servlet 처리 후 무 작위 수 를 추가 하여 프론트 에 되 돌려 표시 합 니 다.
jsp 페이지 index.jsp


<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <title>My JSP 'index.jsp' starting page</title>
  <script type="text/javascript">
  /*
    ajax      ：
    1、  XmlHttpRequest  
    2、      
    3、  Open           
    4、        
    5、                  
  */
    var xmlHttp;
    function createXMLHttpRequest(){  //1  XmlHttpRequest  
      if(window.ActiveXObject){
        try{
          xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
        }catch(e){
          alert("Error!!!");
        }
      }else{
        xmlHttp = new XMLHttpRequest();
      }
    }
    function showMes(){   //2      
      if(xmlHttp.readyState==4){ //           
        if(xmlHttp.status==200){ //http  OK
        //5、                  
          document.getElementById("sp").innerHTML = xmlHttp.responseText; //        
        }else{
          alert("  ："+xmlHttp.statusText); //HTTP        
        }
      }
    }
    /**
    //  GET    
    function getMes(){
      createXMLHttpRequest();
      var txt = document.getElementById("txt").value;
      var url="servlet/AjaxServlet?txt="+txt;
      url = encodeURI(url); //       
      xmlHttp.open("GET",url,true); //3  Open           
      xmlHttp.onreadystatechange=showMes;
      xmlHttp.send(null); //4        
    }
    */
    /**
    *  post  
    */
    function postMes(){
      createXMLHttpRequest();
      var txt = document.getElementById("txt").value;
      var url = "servlet/AjaxServlet";
      var params = "username="+txt;
    // alert(params);
      xmlHttp.open("POST",url,true);
      xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
      xmlHttp.send(params);
      xmlHttp.onreadystatechange = showMes;
    }
  </script>
 </head>
 <body>
  <input type="text" id="txt"/>
  <input type="button" value="query" onclick="postMes()" />
  <span id="sp"></span>
 </body>
</html>

2.배경 Servlet 에 random 무 작위 수 를 추가 하고 관건 적 인 코드 는 다음 과 같 습 니 다.


public void doGet(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    request.setCharacterEncoding("utf-8"); // utf-8          
    response.setContentType("text/html");
    PrintWriter out = response.getWriter();
    String txt = request.getParameter("txt");
//   String tx = new String(txt.getBytes("iso-8859"),"utf-8");
    out.print("txt="+txt+Math.random());
    out.flush();
    out.close();
}
/**
* The doPost method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to post.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doPost(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    request.setCharacterEncoding("utf-8");
    response.setContentType("text/html;charset=UTF-8");
    PrintWriter out = response.getWriter();
    String username = request.getParameter("username");
//   String txt = new String(username.getBytes("ISO-8859-1"),"UTF-8");
    String txt = new String(username);
    out.print("txt="+txt+":"+Math.random());
    out.flush();
    out.close();
}

ajax 관련 내용 에 관심 이 있 는 독자 들 은 본 사이트 의 주 제 를 볼 수 있 습 니 다.,,,과 을 볼 수 있 습 니 다.
본 논문 에서 말 한 것 이 여러분 의 ajax 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

AJAX의 도메인 간 액세스 - 두 가지 효과적인 해결 방법 소개

새로운 W3C 정책은 HTTP 크로스 도메인 접근을 실현했고 제가 오랫동안 이 문제를 해결한 덕분입니다. servlet에서 되돌아오는 머리 정보에 Access-Control-Allow-Origin을 추가하면 됩니다....

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

AJAX+Servlet 에서 실 현 된 데이터 처리 디 스 플레이 기능 예시

좋은 웹페이지 즐겨찾기