JS Ajax XMLHttpRequest and JQ $.ajax

Source: Internet
Author: User
Tags commit http request

Methods and properties of XMLHttpRequest objects

Method
Description
Abort ()
Stop current request
getAllResponseHeaders ()
Returns all the response headers of an HTTP request as a key/value pair
getResponseHeader ("header")
Returns the string value of the specified header
Open ("Method", "url")
Establish a call to the server. The method parameter can be get, post, or put. The URL parameter can be a relative URL or an absolute URL. This method also includes 3 optional parameters
Send (content)
Send a request to the server
setRequestHeader ("header", "value")
Sets the specified header to the supplied value. The open () must be called before any header is set.
Property
Description
onReadyStateChange
This event handler is triggered when each state changes, and typically a Web page effect function is invoked
ReadyState
The status of the request. There are 5 desirable values: 0 = uninitialized, 1 = loading, 2 = loaded, 3 = interactive, 4 = complete
ResponseText
The response of the server, expressed as a string
Responsexml
The response of the server, expressed as XML. This object can be parsed into a DOM object
Status
HTTP status code of the server (200 corresponds ok,404 to not found (not found), etc.)
StatusText
Appropriate text for the HTTP status code (OK or not found (not found), etc.)

<script type= "Text/javascript" >
6 var req;
7 function Sendtime () {
8 var url = "ajaxserver.asp tutorial x";
9 if (window.xmlhttprequest)//non IE browser and IE7 (7.0 and above), created with XMLHttpRequest object
10 {
One req = new XMLHttpRequest ();
12}
//ie (6.0 and below) browsers are created with ActiveXObject objects and may fail if the user's browser disables ActiveX.
14 {
req = new ActiveXObject ("Microsoft.XMLHTTP");
16}
if (req) {
Xmlhttp.open ("Post", url, false);
Xmlhttp.onreadystatechange = function () {
if (Xmlhttp.readystate = 4) {
if (Xmlhttp.status = = 200) {
document.getElementById ("Txttime"). Value = Xmlhttp.responsetext;
23}
Or else {
Alert (' Ajax error ');
26}
27}
28}
Xmlhttp.send ();
30}
31}
32
</script>
<body>
<input id= "Txttime" type= "text"/><input id= "btn1" type= "button" value= "Ajax" onclick= "Sendtime ()"/>
Panax Notoginseng </body>
jquery Ajax

Ajax.request (
Url
{
Method:method,
Parameters:para,
Postbody:xmlstring,
Asynchronous:true,
Setrequestheader:object,
Oncomplete:completefun,
Onerror:errorfun
}
)
Sends an asynchronous request. (This method is written for compatible prototype.js, the invocation style is consistent with prototype, use Ajax.request this method to load this JS file on the page)

Parameters
Url
Required option. The destination address of the data sent.
Method
Options available. The way the data is submitted, and the default value is get. Often, there are post.
Parameters
is optional when method is get, and is required for post. Send the data, in the form of: name1=valeu1& name2=value2&name3=value3 ...
Postbody
Options available. The XML format string sent by the client. If Postbody is enabled, then parameters will be ignored.
Asynchronous
Options available. Specifies whether the request is asynchronous, and the default is True (asynchronous).
setRequestHeader
Specifies the header string for the request. Objects whose value type is "Name value pair", such as: {"if-modified-since": "0", "soapaction": "Http://tempuri.org/sbs_webservice", ...}
OnComplete
Options available. The callback function that executes when the request succeeds by default to the current use of the XMLHTTP object as the first argument.
OnError
Options available. The callback function that executes when an exception is requested, which defaults to the current use of the XMLHTTP object as the first argument.
return value
The XMLHTTP object currently in use.

Describe
Sends an asynchronous request and returns a XMLHTTP object that has a built-in abort () method for prematurely terminating the request. If the asynchronous request succeeds, the OnComplete executes and the onerror is executed. and returns the XMLHTTP object.
Ajax.request is an interface-complete AJAX approach that is the core approach to all other Ajax methods in Myjsframe.

Example
Example one:
<script type= "Text/javascript" >
var myajax = new Ajax.request (
"Http://www.111cn.net",
{
Method: "POST",//form submission
Parameters: "Name=acai&age=26&sex=male",//Submitted form data
setrequestheader:{"if-modified-since": "0"},//Disable reading of cached data
Oncomplete:function (x) {//Commit a successful callback
alert (X.responsetext);
},
Onerror:function (x) {//Commit failed callback
alert (X.statustext);
}
}
);
</script>


Note: If the parameters parameter is not listed, we can do this in development for data such as form forms

 parameters:form.serialize (' FormName ')    formname  for the ID of the form in the page

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.