1.JSP Code
<%@ 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><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8"><title>Page no refresh update Ajax update time</title><Scripttype= "Text/javascript"> functionCreateajax () {varAjax= NULL; Try{Ajax= NewActiveXObject ("Microsoft.XMLHTTP"); //alert ("Your browser supports AJAX, is IE"); } Catch(E1) {Ajax= NewXMLHttpRequest (); //alert ("Your browser supports AJAX, non-IE"); } returnAjax; }</Script></Head><Body>Current Time:<spanID= "Spantime"></span> <BR> <BR> <inputtype= "button"ID= "Buttontime"value= "Asynchronous Commit method" /></Body><Scripttype= "Text/javascript">Window.document.getElementById ("Buttontime"). onclick= function() { //1. Create an Object varAjax=Createajax (); //2. Asynchronous object ready to send request varMethod= "GET"; varURL= "${pagecontext.request.contextpath}/timeajaxservlet?time =" + NewDate (). GetTime (); Ajax.open (method, URL); //The 3.AJAX asynchronous object actually sends the data of the request body to the server, and if the request body has no data, it is represented by null varcontent= NULL; Ajax.send (content); //---------------------------------Wait------------------------- //4. Ajax asynchronous objects constantly listen to changes in the state of the server, only the status code changes, the function can be triggered //0-1-2-3-4, these are the functions that can trigger a function. //4-4-4-4-4, these are non-triggering functions. //The following function is triggered by the server, not the programmer, which is not the same as the onclick.Ajax.onreadystatechange= function() { //If the status code is 4 if(Ajax.readystate== 4) { //if the server responds with a if(Ajax.status== $) { //5. Getting the results of a server response from an Ajax asynchronous object varTimestr=Ajax.responsetext; //6. Follow the DOM rules to dynamically add the results to the label that the Web page points todocument.getElementById ("Spantime"). InnerHTML=Timestr; } } } }</Script></HTML>
2.servlet Code
PackageCom.buaa.ajax;Importjava.io.IOException;ImportJava.io.PrintWriter;ImportJava.text.SimpleDateFormat;Importjava.util.Date;Importjavax.servlet.ServletException;ImportJavax.servlet.annotation.WebServlet;ImportJavax.servlet.http.HttpServlet;Importjavax.servlet.http.HttpServletRequest;Importjavax.servlet.http.HttpServletResponse; @WebServlet ("/timeajaxservlet") Public classTimeajaxservletextendsHttpServlet {Private Static Final LongSerialversionuid = 1L; protected voiddoget (httpservletrequest request, httpservletresponse response)throwsservletexception, IOException {response.setcontenttype ("Text/html;charset = UTF-8"); SimpleDateFormat SDF=NewSimpleDateFormat ("Yyyy-mm-dd HH:mm:ss"); String Timestr= Sdf.format (NewDate ()); //Note that to implement asynchronous processing, you cannot forward or redirect, because then the browser page refreshes//so to stream the results of the server output browserPrintWriter PW =Response.getwriter (); Pw.write (TIMESTR); Pw.flush (); Pw.close (); }}
Note: Get Way Ajax Submission (Chinese) to convert the encoding format
Learn Aiax (JavaScript)--page No refresh update Ajax update time
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
