JS compatible multi-browser AJAX Request code example

Cases

The code is as follows

Copy Code

var ajax = function () {}; Ajax.prototype = { Request:function (method, URL, callback, Postvars) { var xhr = This.createxhrobject (); Xhr.onreadystatechange = function () { if (xhr.readystate!== 4) return; (Xhr.status = = 200)? Callback.success (Xhr.responsetext, Xhr.responsexml): Callback.failure (Xhr,status); }; if (method!== "POST") { URL + "?" + jsonstringify (postvars); Postvars = null; } Xhr.open (method, URL, true); Xhr.send (Postvars); }, Createxhrobject:function () { var methods = [ function () {return new XMLHttpRequest ();}, function () {return new ActiveXObject ("Msxml2.xmlhttp");}, function () {return new ActiveXObject ("Microsoft.XMLHTTP");} ], i = 0, len = methods.length; for (; i < Len; i++) { try { Methods[i]; catch (e) { Continue } This.createxhrobject = Methods[i]; return methods[i]; } throw new Error ("Ajax created Failure"); }, Jsonstringify:function (obj) { return json.stringify (obj). Replace (/"|{|} /g, "") . replace (/b:b/g, "=") . replace (/b,b/g, "&"); } };

JQuery $.ajax Overview

When jquery is present, it makes Ajax easier to implement.

jquery, the Ajax high-level implementation of the main $.get (), $.post (), and so on, the following details on the use of $.ajax ()

1. Request Page Ajax.aspx

The JS code is as follows:

The code is as follows

Copy Code

<script type= "Text/javascript" > function Text_ajax () { $.ajax ( { Type: "Get",//usually uses two kinds: get,post. The default is: Get URL: "Responsetext.aspx",//(Default: Current page address) send the requested address DataType: "HTML",//expected data type returned by the server. Beforesend:beforesend,//Send Request Success:callback,//Request success error:error,//Request Error complete:complete//Request Complete }); } Function error (XMLHttpRequest, Textstatus, Errorthrown) { Typically, only one of the Textstatus and Errorthown has a value. $ ("#showResult"). Append ("<div> request is wrong!") </div> "); } function complete (XMLHttpRequest, textstatus) { $ ("#showResult"). Append ("<div> request complete </div>"); } function Beforesend (XMLHttpRequest) { $ ("#showResult"). Append ("<div> send Request .....<div>"); } function Callback (MSG) { $ ("#showResult"). Append ("Successful <div> request, return number:" +msg+ "<div>"); } </script>

The HTML code is as follows:

The code is as follows	Copy Code
<input value= "Text_ajax function" type= "button" onclick= "Text_ajax ()"/> <div id= "Showresult" > </div>

Response Page Jqueryajax.aspx

Background code:

The code is as follows	Copy Code
protected void Page_Load (object sender, EventArgs e) { Response.Write ("Hehe!") The test was successful! "); }

jQuery Ajax Chinese garbled problem?

: Ajax configuration ContentType properties, plus Charset=utf-8

Add the following parameters to the Ajax method

ContentType: "application/x-www-form-urlencoded; Charset=utf-8″ use other JS frame or XHR is similar, set header in ContentType can,

The key here is charset=utf-8, if there is no this, is not, the default jquery contenttype is not.

Method Two does not need to be decode in action, so it is recommended to use this method