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页面结果：