熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

ajax入門小程序

2022-06-13   來源: JSP教程 

  此小程序主要給ajax還未入門的朋友們一個簡單的演示程序的主要內容就是將頁面部分的id通過表單傳到java的servlet中因為只是做示例所以沒有對id進行任何處理有興趣的朋友可以連接數據庫或應用一些jdk方法進行處理操作等等在此僅作示例話不多說了(這話就不少了)看代碼吧

  ajaxdemojsp <%@ page language=java pageEncoding=GB%>
<!DOCTYPE HTML PUBLIC //WC//DTD HTML Transitional//EN>
<html>
  <head>
    <title>My JSP ajaxdemojsp starting page</title>
  <script type=text/javascript
      var req;
      function createAJAX() {
        if(windowXMLHttpRequest) {
          req = new XMLHttpRequest();
        } else if(windowActiveXObject) {
          req = new ActiveXObject(MicrosoftXMLHTTP);
        }
      }
     
      function testAjax() {
          var url = /testajax/servlet/TestAjaxServlet?id=;
          createAJAX();
          reqopen(POST url true);
          reqonreadystatechange = callback;
          reqsend(null);
      }
     
      function callback() {
        if(reqreadyState == ) {
          if(reqstatus == ) {
            documentgetElementById(ajaxDiv)innerHTML = reqresponseText;
          }
        }
      }
  </script>
  </head> 
  <body>
    <input type=button value=測試ajax name=button id=ajaxButton onclick=testAjax()><br>
    可以根據下邊這個id號進行操作<div id=ajaxDiv></div>
  </body>
</html>

  說明因為只是一個簡簡單單的玩意所以頁面部分未使用任何ajax框架只是用最基本的ajax原理實現頁面會將id通過ajax傳到後台

  webxml

  <?xml version= encoding=UTF?>
<webapp version=
 xmlns=
 xmlns:xsi=instance
 xsi:schemaLocation=
 app__xsd>
  <servlet>
    <servletname>TestAjaxServlet</servletname>
    <servletclass>comajaxTestAjaxServlet</servletclass>
  </servlet>

  <servletmapping>
    <servletname>TestAjaxServlet</servletname>
    <urlpattern>/servlet/TestAjaxServlet</urlpattern>
  </servletmapping>
 
  <welcomefilelist>
    <welcomefile>ajaxdemojsp</welcomefile>
  </welcomefilelist>
</webapp>

  說明既然用到servlet了那難免要配置一下webxml了將對應servlet信息配置在webxml中

  TestAjaxServletjava

  package comajax;

  import javaioIOException;
import javaioPrintWriter;

  import javaxservletServletException;
import javaxservlethttpHttpServlet;
import javaxservlethttpHttpServletRequest;
import javaxservlethttpHttpServletResponse;

  @SuppressWarnings(serial)
public class TestAjaxServlet extends HttpServlet {

  public void doPost(HttpServletRequest request HttpServletResponse response)
   throws ServletException IOException {

  responsesetContentType(text/html);
  String id = requestgetParameter(id);
  //可在此處判斷id是否為空並根據id做你相應的處理隨意!
  PrintWriter out = responsegetWriter();
  outprintln(<!DOCTYPE HTML PUBLIC \//WC//DTD HTML Transitional//EN\>);
  outprintln(<HTML>);
  outprintln(  <HEAD><TITLE>A Servlet</TITLE></HEAD>);
  outprintln(  <BODY>);
  outprint(id);
  outprintln(  </BODY>);
  outprintln(</HTML>);
  outflush();
  outclose();
 }

  說明寫一個最最……簡單的doPost方法可以加上你自己的代碼處理完了id把它毫不留情的扔回頁面然後看看結果吧

  結尾謹獻給接觸java web希望了解ajax但又在迷茫中的朋友


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19365.html
    推薦文章
    Copyright © 2005-2022 電腦知識網 Computer Knowledge   All rights reserved.