Shulou(Shulou.com)06/03 Report--

This article will explain in detail the example analysis of the mixed use of AJAX and JSP. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

The first thing to know is that AJAX is a technology that can update parts of a web page without reloading the entire page.

What is AJAX?

AJAX = asynchronous JavaScript and XML.

AJAX, namely "Asynchronous Javascript And XML" (Asynchronous JavaScript and XML), refers to a web page development technology that creates interactive web page applications. AJAX is a technology for creating fast dynamic web pages.

By exchanging a small amount of data with the server in the background, AJAX can update web pages asynchronously. This means that some part of the page can be updated without reloading the entire page.

Traditional web pages (without AJAX) if you need to update the content, you must reload the entire web page.

How AJAX works

AJAX request

Ajax requests rely on XMLHttpRequest objects, so create their objects before making a request

Var xmlhttp;// compatibility is used to create request instances. IE5 6 supports the method if (window.XMLHttpRequest) {xmlhttp = new XMLHttpRequest ();} else {xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP");} in else.

Then send the request to the server

The open function takes three parameters, the request method, the request address, and whether the request is asynchronous or synchronous

The send (String) function takes a parameter, and the String parameter needs to be taken only if the request method is post.

So what's the difference between GET and POST?

GET is simpler and faster than POST, and works in most cases.

However, use the POST request in the following cases:

Cannot use cache files (update files or databases on the server)

Send a large amount of data to the server (POST has no data limit)

POST is more stable and reliable than GET when sending user input containing unknown characters

/ / sets the transmission method, address, and synchronous or asynchronous xmlhttp.open ("GET", "Test.jsp?value=" + escape (value), true); this function is executed when xmlhttp.onreadystatechange = callback;// state changes, which is used to determine whether the request has been completed for xmlhttp.send (). / / request server. If post mode is used, the parameters passed in send should be / / post mode / * * xmlhttp.open ("POST", "Test.jsp", true); xmlhttp.setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); xmlhttp.send ("value=" + value); * /

Then the server processes it and returns it. There is a specific code in the instance.

Set the response to return in the callback function callback

Onreadystatechange stores the function (or function name), which is called whenever the readyState property changes.

ReadyState stores the status of XMLHttpRequest. It changes from 0 to 4.

0: request is not initialized

1: the server connection has been established

2: the request has been received

3: request processing

4: the request has been completed and the response is ready

Status 200: "OK"

404: page not found

Type of the corresponding server

ResponseText gets the response data as a string.

ResponseXML gets the response data in the form of XML. This is usually used when the url in open is a xml file.

Function callback () {/ / request completion indicates if (xmlhttp.readyState = = 4 & & xmlhttp.status==200) {/ / set the corresponding operation}

Generally speaking, there are only a few steps. Here is the detailed code.

Example

First create a text box to test the user name and add the listening event onblur, which means execution when the focus is lost, followed by an empty span tag to dynamically display information indicating whether the name is occupied

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.