1.index.html
1<!DOCTYPE html> 2<html> 3<head> 4<meta charset="UTF-8"> 5<title>Insert title here</title> 6<script type="text/javascript" src="js/jquery-2.1.0.js"></script> 7<script type="text/javascript"> 8 $(function(){ 9 //为输入框绑定事件 10 $("#btn").click(function(){ 11 //1、点击提交后获得输入框的内容 12 var name = $("#uname").val(); 13 //AJAX回调(调用后台方法返回数据) 14 $.get("HelloAjax",{"uname":name},function(data){ 15 alert(data); 16 }) 17 }) 18 }) 19</script> 20</head> 21<body> 22 <input type="text" id="uname"><input id="btn" type="button" value="提交"> 23</body> 24</html>
2.HelloAjax.java
1package web; 2 3import java.io.IOException; 4import java.io.PrintWriter; 5 6import javax.servlet.ServletException; 7import javax.servlet.annotation.WebServlet; 8import javax.servlet.http.HttpServlet; 9import javax.servlet.http.HttpServletRequest; 10import javax.servlet.http.HttpServletResponse; 11//Servlet 12@WebServlet("/HelloAjax") 13 14public class HelloAjax extends HttpServlet { 15 private static final long serialVersionUID = 1L; 16 17 public HelloAjax() { 18 super(); 19 } 20 21 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 22 //获得输入的内容,从request取数据,通俗说就是从浏览器取数据 23 String name = request.getParameter("uname"); 24 System.out.println("欢迎:"+name); 25 PrintWriter out = response.getWriter();//返回的是PrintWriter，这是一个打印输出流。 26 out.print("this is Ajax");//不仅可以打印输出文本格式的（包括html标签），还可以将一个对象以默认的编码方式转换为二进制字节输出 27 } 28 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 29 doGet(request, response); 30 } 31 32}