jQuery ajax 與服務器交互方法

1.HTML

<table>
    <tr>
        <td>用戶名：</td>
        <td><input type="text" name="username" id="name"></td>
    </tr>
    <tr>
        <td>密&emsp;碼：</td>
        <td><input type="password" name="password" id="password"></td>
    </tr>
    <tr>

        <td rowspan="2"><button id="but">提交</button></td>
    </tr>
</table>
   <span id="show"></span>

2.JavaScript

$(function () {
   $("#but").click(function () {
       var name=$('#name').val();
       var password=$('#password').val();
       var url="LoginServlet";

      //ajax post方法
      /* $.post(url,{username:name,password:password},function () {
           $('#show').text("success");
       });*/
       //ajax ajax方法
     /* $.ajax({
          type:"post",
          url:url,
          data:{username:name,password:password},
          success:function () {
              $('#show').text("登錄成功");
          },
          error:function () {
              $('#show').text("登錄失敗");
          },
      });*/
      //ajax get方法
       $.get(url,{username:name,password:password},function (data) {
           $('#show').text(data);
       });

   }) ;
});

Java代碼：

protected void doGet(javax.servlet.http.HttpServletRequest request, javax.servlet.http.HttpServletResponse response) throws javax.servlet.ServletException, IOException {
       String name=request.getParameter("username");//獲得用戶名
       String password=request.getParameter("password");//獲得密碼
       String success="登錄成功收到數據";
       if(name.equals("admin")&password.equals("admin")){//判斷
           System.out.println("登錄成功");
          
       }else {
           System.out.println("密碼或用戶名不正確");
       }
}

運行結果圖：
控制台運行結果：

html頁面結果
：