1.index.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="js/jquery-2.1.0.js"></script> <script type="text/javascript"> $(function(){ //為輸入框綁定事件 $("#btn").click(function(){ //1、點擊提交后獲得輸入框的內容 var name = $("#uname").val(); //AJAX回調(調用后台方法返回數據) $.get("HelloAjax",{"uname":name},function(data){ alert(data); }) }) }) </script> </head> <body> <input type="text" id="uname"><input id="btn" type="button" value="提交"> </body> </html>
2.HelloAjax.java
package web; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; //Servlet @WebServlet("/HelloAjax") public class HelloAjax extends HttpServlet { private static final long serialVersionUID = 1L; public HelloAjax() { super(); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //獲得輸入的內容,從request取數據,通俗說就是從瀏覽器取數據 String name = request.getParameter("uname"); System.out.println("歡迎:"+name); PrintWriter out = response.getWriter();//返回的是PrintWriter，這是一個打印輸出流。 out.print("this is Ajax");//不僅可以打印輸出文本格式的（包括html標簽），還可以將一個對象以默認的編碼方式轉換為二進制字節輸出 } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }