AJAX调用SERVLET例子详解编程语言

工作需要自己写了个例子调用SERVLET的，可以运行，

很简单就是一个index.jsp页面，一个GetAndPostExample servlet后台，和WEB.XML配置文件

index.jsp页面

——————————————————————————————————-

<%@ page language=”java” import=”java.util.*” pageEncoding=”gb2312″%> <%request.setCharacterEncoding(“GB2312”);%> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml”> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ /> <title>AJAX测试</title> <mce:script language=”javascript”><!– var xmlHttp; //创建xmlHttp function createXMLHttpRequest() { if(window.ActiveXObject) { xmlHttp=new ActiveXObject(“Microsoft.XMLHTTP”); } else if(window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } } //拼出要发送的姓名数据 function createQueryString() { var firstName=document.getElementById(“firstname”).value; var middleName=document.getElementById(“middleName”).value; var birthday=document.getElementById(“birthday”).value; var queryString=”firstName=” + firstName + “&middleName=” + middleName + “&birthday=” + birthday; return queryString; } //使用get方式发送 function doRequestUsingGET() { createXMLHttpRequest(); var queryString=”./GetAndPostExample?”; queryString=queryString+createQueryString() + “&timeStamp=” + new Date().getTime(); xmlHttp.onreadystatechange=handleStateChange; xmlHttp.open(“GET”,queryString,true); xmlHttp.send(null); } //使用post方式发送 function doRequestUsingPost() { createXMLHttpRequest(); var url=”./GetAndPostExample?timeStamp=” + new Date().getTime(); var queryString=createQueryString(); xmlHttp.open(“POST”,url,true); xmlHttp.onreadystatechange=handleStateChange; xmlHttp.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”); xmlHttp.send(queryString); } function handleStateChange() { if(xmlHttp.readyState==4) { if(xmlHttp.status==200) { parseResults(); } } } //解析返回值 function parseResults() { var responseDiv=document.getElementById(“serverResponse”); if(responseDiv.hasChildNodes()) { responseDiv.removeChild(responseDiv.childNodes[0]); } var responseText=document.createTextNode(xmlHttp.responseText); alert(“后台返回的返回值： “+xmlHttp.responseText); responseDiv.appendChild(responseText); } // –></mce:script> </head> <body> <form id=”form1″ name=”form1″ method=”post” action=”#”> 姓：<input name=”firstName” type=”text” id=”firstName” /> <label> 名：<input type=”text” name=”middleName” id=”middleName” /> </label> 生日：<input name=”birthday” type=”text” id=”birthday” /> <input type=”button” name=”Submit” value=”GET” onclick=”doRequestUsingGET();”/> <input type=”button” name=”Submit2″ value=”POST” onclick=”doRequestUsingPost();”/> <div id=”serverResponse”></div> </form> </body> </html>

——————————————————————————————————-

GetAndPostExample

——————————————————————————————————-

package temp; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class GetAndPostExample extends HttpServlet { /** * Constructor of the object. */ public GetAndPostExample() { super(); } /** * Destruction of the servlet. */ public void destroy() { super.destroy(); // Just puts “destroy” string in log // Put your code here } /** * The doGet method of the servlet. * * This method is called when a form has its tag value method equals to get. * * @param request * the request send by the client to the server * @param response * the response send by the server to the client * @throws ServletException * if an error occurred * @throws IOException * if an error occurred */ public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doPost(request, response); } /** * The doPost method of the servlet. * * This method is called when a form has its tag value method equals to * post. * * @param request * the request send by the client to the server * @param response * the response send by the server to the client * @throws ServletException * if an error occurred * @throws IOException * if an error occurred */ public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String data = “”; String temp = “”; temp = (String) request.getParameter(“firstName”); data = data + “第一个名字” + temp; temp = (String) request.getParameter(“middleName”); data = data + ” 中间的名字” + temp; temp = (String) request.getParameter(“birthday”); data = data + ” 生日” + temp; temp = (String) request.getParameter(“timeStamp”); data = data + ” 调用时间” + temp; System.out.println(“获得的数据 ” + data); response.setContentType(“text/html;charset=gb2312”); PrintWriter out = response.getWriter(); out.println(data); out.flush(); out.close(); } /** * Initialization of the servlet. * * @throws ServletException * if an error occurs */ public void init() throws ServletException { // Put your code here } }

——————————————————————————————————-

web.xml

——————————————————————————————————-

<?xml version=”1.0″ encoding=”UTF-8″?> <web-app version=”2.4″ xmlns=”http://java.sun.com/xml/ns/j2ee” xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:schemaLocation=”http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd”> <servlet> <description>This is the description of my J2EE component</description> <display-name>This is the display name of my J2EE component</display-name> <servlet-name>GetAndPostExample</servlet-name> <servlet-class>temp.GetAndPostExample</servlet-class> </servlet> <servlet-mapping> <servlet-name>GetAndPostExample</servlet-name> <url-pattern>/GetAndPostExample</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>

——————————————————————————————————-

原创文章，作者：奋斗，如若转载，请注明出处：https://blog.ytso.com/industrynews/13650.html

AJAX调用SERVLET例子详解编程语言

相关推荐

发表回复