Javaweb-----------Ajax

1. What is Ajax?

In short, Ajax is a local refresh technique that refreshes a local interface by sending it to the server and getting a request, rather than refreshing the entire interface.

It sends and obtains data to the server by using JavaScript and XMLHttpRequest in the HTML page. It can implement local refresh and asynchronous refresh of the page.

2. What if there is no Ajax?

If you are watching online video, if there is no Ajax this local refresh technology, then every time you review the video will refresh the page. So after each review, you can only start from the beginning to play, is not very troublesome.

3, through the page of local refresh add to experience the benefits of Ajax

The first is the servlet side, which gets the values of I and J sent by the front end and calculates and returns.

Code

 PackageCom.xyf.web6;Importjava.io.IOException;Importjavax.servlet.ServletException;ImportJavax.servlet.http.HttpServlet;Importjavax.servlet.http.HttpServletRequest;ImportJavax.servlet.http.HttpServletResponse; Public classAjax1servletextendshttpservlet{@Overrideprotected voiddoget (httpservletrequest req, HttpServletResponse resp)throwsservletexception, IOException { This. DoPost (req, resp); } @Overrideprotected voidDoPost (httpservletrequest req, HttpServletResponse resp)throwsservletexception, IOException {String action= Req.getparameter ("Action"); if(action==NULL|| Action.length () <0) {Req.getrequestdispatcher ("/ajax1.jsp"). Forward (req, resp); }        Else if(Action.equals ("Add"))        {            inti = Integer.parseint (Req.getparameter ("I")); intj = Integer.parseint (Req.getparameter ("J")); Resp.setcontenttype ("Text/html"); Resp.getwriter (). Print (I+j); System.out.println ("Data acquired"); }    }}

JSP side, through the GetByID to get the value of add in the form input, and then get the values of I and J in JavaScript, and wrap it as an AJAX request before sending it, it is important to note that the program does not end after the Send program executes

The onreadystatechange listens for events and ends when a request is sent to the server before the response starts to execute.

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" >window.onload=function () {var add= document.getElementById ("Add"); Add.onclick=function () {var i= document.getElementById ("I"). Value; var J= document.getElementById ("J"). Value; //xhr Object execution, HTTP request, page not refreshedvar xhr = window. XMLHttpRequest?NewXMLHttpRequest ():NewActiveXObject (' microsoft.xmlhttp ');//Create XMLHTTP objects, consider compatibilityXhr.open ("POST", "ajax1?action=add&i=" +i+ "&j=" +j,true); Xhr.onreadystatechange=function () {alert ("Onreadystatechange,readystate=" +xhr.readystate); if(xhr.readystate==4)//the server returned                {                    if(xhr.status==200)//xhr.status HTTP status Code{alert (xhr.responsetext);//the style of newspaper returned by Xhr.responsetextdocument.getElementById ("Result"). InnerText =Xhr.responsetext; //update the content that needs to be updated based on what the server returns                    }                    Else{alert ("Server returned error");            }                }            }; Alert ("Before Send"); Xhr.send ();//make a request. Does not wait for the server to return to the Send method before it ends, because we need to listen ahead Xhr.onreadystatechange//event to know that "the server returned"Alert (after "send");    }; };</script>
It is loaded in order to get the values of I and J after the form Submit button, and wraps him as an AJAX request to the server (at which point the Ajax event is listening), and when the server obtains it and transmits it back, the page completes a partial refresh.
Not to be continued
Javaweb-----------Ajax