程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> JSP編程 >> 關於JSP >> jsp+ajax發送GET請求的方法

jsp+ajax發送GET請求的方法

編輯:關於JSP

     本文實例講述了ajax發送GET請求,然後通過jsp頁面來接收處理的實現方法。分享給大家供大家參考。具體實現方法如下:

    Ajax發送GET請求

    這裡用一個實例演示Ajax發送get請求,實例具體要求為一個注冊頁面,當用戶填寫完用戶名稱時,該輸入框失去焦點後會通過Ajax向後台發送驗證信息,如果用戶名不是admin則通過驗證,否則不通過驗證。

    下面先看JSP頁面具體信息:

    代碼如下: <form action="servlet/LoginServlet" method="post">
        <table>
            <tr>
                <td>用戶賬號:</td>
                <td><input type="text" name="username" onblur="checkUser(this)"/></td>
            </tr>
            <tr>
                <td>用戶密碼:</td>
                <td><input type="password" name="password"/></td>
            </tr>
            <tr>
                <td><input type="submit" value="注冊"/></td>
                <td><input type="reset" value="重置"></td>
            </tr>
        </table>
    </form>

     

    這裡後台處理信息用的是Servlet進行處理

    首先看web.xml配置信息

    代碼如下: <servlet>
    <servlet-name>LoginServlet</servlet-name>
    <servlet-class>login.LoginServlet</servlet-class>
    </servlet>

     

    <servlet-mapping>
    <servlet-name>LoginServlet</servlet-name>
    <url-pattern>/servlet/LoginServlet</url-pattern>
    </servlet-mapping>

     

    然後看具體的servlet類的doGet方法

    代碼如下: public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

     

            response.setContentType("text/html;charaet=UTF-8");
            PrintWriter out = response.getWriter();
            String name=request.getParameter("username");
            System.out.println(name);
            if(name.equals("admin"))
                out.print(false);
            else
                out.print(true);
            out.flush();
            out.close();
    }

     

    在Servlet類中做一個簡單的驗證。

    在JSP的表單中,對輸入用戶名稱的輸入框設置了失去焦點的事件,也就是onblur事件。下面看javascript代碼。

    代碼如下: <script type="text/javascript">
        //創建XMLHttpRequest
        function createXmlHttpRequest(){
            if(window.XMLHttpRequest){
                return new XMLHttpRequest();
            }else{
                return new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
        //當用戶賬號輸入框失去焦點時調用該方法
        function checkUser(obj){
            //獲取輸入框輸入的值
            var user = obj.value;
            //如果輸入框中的值為空,那麼彈窗提示,並且讓該輸入框獲得焦點
            if(!user){
                alert("用戶名不能為空!");
                obj.focus();
                return;
            }
            //不為空時,使用Ajax請求向後台發送信息,驗證該用戶名是否可用
            //get請求字符串
            var url="servlet/LoginServlet?username="+user;
            //調用方法創建XMLHttpRequest對象
            XmlHttpRequest = createXmlHttpRequest();
            //設置回調函數
            XmlHttpRequest.onreadystatechange=finish;
            //初始化xmlhttprequest
            XmlHttpRequest.open("GET",url,true);
            //發送請求
            XmlHttpRequest.send(null);
        }
        //回調函數
        function finish(){
            if(XmlHttpRequest.readyState == 4&& XmlHttpRequest.status == 200){
                var result = XmlHttpRequest.responseText;
                if(result =="true"){
                    alert("用戶名可用!");
                }else{
                    alert("用戶名不可用!");
                }
            }
        }
    </script>

     

    希望本文所述對大家的jsp+Ajax程序設計有所幫助。

    1. 上一頁:
    2. 下一頁:
    Copyright © 程式師世界 All Rights Reserved