/index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript"> window.onload=function(){ var btn=document.getElementById("btn01"); btn.onclick=function(){ //创建对象 var xhr=new XMLHttpRequest(); //设置参数 var method="post"; var url="${pageContext.request.contextPath}/AServlet"; xhr.open(method,url); xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //发送请求 xhr.send("username=liuchuan"); //接受响应 xhr.onreadystatechange=function(){ if(xhr.readyState==4&&xhr.status==200){ var div1=document.getElementById("div1"); var data=xhr.responseText; div1.innerHTML += data; } } } } </script> </head> <body> <button id="btn01">电风扇</button> <div id="div1"> </div> </body> </html>
/e.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="/web-ajax/js/jquery.min.js"></script> <script type="text/javascript"> $(function () { $("#btn01").click(function(){ function callback(data) { alert(data); div1.innerHTML += data; } $.get("${pageContext.request.contextPath}/AServlet?&t"+Math.random(),{"username":"zhangsan"},callback); $("#div1").html(data);//加个随机数防止浏览器缓存 }) }); </script> </head> <body> <button id="btn01">电风扇</button> <div id="div1"> </div> </body> </html>
/class AServlet
package com.neuedu.servlet; import java.io.IOException; 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("/AServlet") public class AServlet extends HttpServlet { private static final long serialVersionUID = 1L; protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String name = request.getParameter("username"); System.out.println("幸福来敲门"+name); response.getWriter().println("<h1>hello word!</h1>"); } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub doGet(request, response); } }