Home > Developer > JavaScript
Today, I wroteCodeThe main function is to test the link between Servlet and JavaScript to complete the refreshing function.
The main code is clear, and the core used is the XMLHTTPRequest object. First, the XMLHTTPRequest object uses five steps: In the following code, I will mark it.
This timeProgramNote the following issues:
1. Remember to redeploy after creating a new project.
2. When creating a servlet, do not forget to include web. xml.
3. You can directly use the onclick event without submitting the form.
4. When passing values, the URL in open () can pass parameters. Example: url = "Servlet/username? Name = "+ username;
The most important thing to think about is the path. Here, when accessing the servlet username, why is the servlet put in front? The "servlet" here is the username package. This html page is under the webroot of the project created by myeclipse.
Below is my code:
Ajax.html:
<! Doctype HTML public "-// W3C // dtd html 4.01 transitional // en">
<HTML>
<Head>
<Title> ajax.html </title>
<Meta http-equiv = "keywords" content = "keyword1, keyword2, keyword3">
<Meta http-equiv = "Description" content = "this is my page">
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8">
<SCRIPT type = "text/JavaScript">
VaR XMLHTTP;
Function submit (){
// Alert ("nihao ");
// Step 1: Create an XMLHTTPRequest object
If (window. XMLHttpRequest ){
XMLHTTP = new XMLHttpRequest ();
If (XMLHTTP. overridemimetype ){
XMLHTTP. overridemimetype ("text/XML ");
}
Else if (window. activexobject)
{
VaR MSXML = ['msxml2. xmlhttp.5.0 ', 'msxml2. xmlhttp.4.0 ',
'Msxml2. xmlhttp.3.0 ', 'msxml2. xmlhttp', 'Microsoft. xmlhttp'];
For (VAR I = 0; I <MSXML. length; I ++ ){
Try {
XMLHTTP = new activexobject (MSXML [I]);
Break;
}
Catch (e ){}
}
}
}
If (XMLHTTP = NULL | XMLHTTP = undefined ){
Alert ("not created successfully ");
}
// Step 2, set the callback function (note that the name of this function is not followed by brackets !)
VaR username = Document. getelementbyid ("username"). value;
Alert (username );
XMLHTTP. onreadystatechange = callback;
Url = "Servlet/username? Username = "+ username;
Alert (URL );
// Step 3: Open the connection
XMLHTTP. Open ("get", URL, true );
// Step 4: send data
XMLHTTP. Send (null );
// Step 5: Write a callback function to receive the data returned by the server
Function callback (){
If (XMLHTTP. readystate = 4 ){
Alert (XMLHTTP. readystate );
If (XMLHTTP. Status = 200 ){
VaR message = XMLHTTP. responsetext;
VaR DIV = Document. getelementbyid ("message ");
Div. innerhtml = message;
}
}
}
}
</SCRIPT>
</Head>
<Body>
<Input type = "text" id = "username" name = "name"/>
<Input type = "Submit" onclick = "Submit ()" value = "verify User Name"/>
<Br/>
<Div style = "background-color: #0c0;" id = "message"> </div>
</Body>
</Html>
Servlet: username. Java code:
Package servlet;
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 username extends httpservlet {
/**
* Constructor of the object.
*/
Public username (){
Super ();
}
Public void doget (httpservletrequest request, httpservletresponse response)
Throws servletexception, ioexception {
Response. setcontenttype ("text/html ");
Printwriter out = response. getwriter ();
String name = new string (request. getparameter ("username "));
Out. println (name );
}
Public void dopost (httpservletrequest request, httpservletresponse response)
Throws servletexception, ioexception {
This. doget (request, response );
}
Public String getservletinfo (){
Return "this is my default servlet created by Eclipse ";
}
Public void Init () throws servletexception {
// Put your code here
}
}
The above is the beginning of Ajax. Come on!
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
