Ajax在JQuery中的应用（get方法练习1）

index.html

<!DOCTYPE html>
<html>
<head>
<Meta charset="UTF-8">
<title>test get()</title>
<script type="text/javascript" src="script/jquery-3.1.1.js"></script>
<script type="text/javascript">
  $(function() {
    $("input:eq(2)").click(function(){
        $.get("GetServlet",{'username':encodeURI(encodeURI($("#username").val())),'password':encodeURI(encodeURI($("#password").val()))
            },function(data,textStatus){
            $("#content").html(data);
            alert(textStatus);
        });
    });
});
</script>
</head>
<body>
  <input type="text" name="username" id="username"/><br/>
  <input type="password" name="password" id="password"/><br/>
  <input type="button" value="登陆"/>
  <div id="content"></div>
</body>
</html>

GetServlet.java

package com.login;

import java.io.IOException;
import java.io.PrintWriter;
import java.net.URLDecoder;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/GetServlet")
public class GetServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
    public GetServlet() {
        super();
        // TODO Auto-generated constructor stub
    }
    protected void doGet(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException {
        // TODO Auto-generated method stub
        response.setContentType("text/html;charset=utf-8");
        response.setCharacterEncoding("utf-8");
        PrintWriter out=response.getWriter();
        request.setCharacterEncoding("utf-8");
        String username=URLDecoder.decode(URLDecoder.decode(request.getParameter("username"),"UTF-8"),"utf-8");//两次解码
        String password=URLDecoder.decode(URLDecoder.decode(request.getParameter("password"),"utf-8");
        if(username.equals("海哥")&&password.equals("haige")){
            out.println("<p>欢迎"+username+"光临</p>");
        }
        else{
            out.println("<p>用户名或密码错误！");
        }
        out.close();
    }
    protected void doPost(HttpServletRequest request,IOException {
        // TODO Auto-generated method stub
        doGet(request,response);
    }

}

截图：

Ajax在JQuery中的应用（get方法练习1）

猜你在找的Ajax相关文章