About Ajax objects some commonly used properties, events, and method case comparison common problem summary _ajax related

Recently more free, so take a time to organize some things about the Ajax method. In the project often found that the Ajax plate a lot of problems are attributes, methods, event case is not distinguish between the problem, resulting in the program running trouble.

　　Here are some common properties, events, and methods for Ajax objects

1 The attributes of the standard Ajax objects are Readystate,status,responsetext,responsexml

2 non-Standard Ajax object properties, for IE browser, there is responsebody,2 data stream. If you do not consider browser compatibility, this property +vbscript can be a good solution to the garbled problem.

Visual Basic Code

Function bytes2bstr (VIN) ' binary string strreturn = ' for
   i = 1 to LenB (VIN)
   Thischarcode = ASCB (MidB (vin,i,1))
   if Thischarcode < &h80 then
    strreturn = Strreturn & Chr (thischarcode)
   else
    Nextcharcode = ASCB (MidB (vin,i+1,1))
    Strreturn = strreturn & Chr (CLng (thischarcode) * &h100 + CInt (nextcharcode))
    I = i + 1 end
   if
   next
   bytes2bstr = Strreturn End
Function

3 event onreadystatechange, State conversion function

4 method has setrequestheader,open,send, used to set the response header, when the specified submission method is post, you need to set Content-type to Application/x-www-form-urlencoded, If this response header is not set, the requested dynamic page cannot obtain a value using the form of a key-value pair, although the submitted data can be generated from the binary stream.

Reference

How to get the submitted content when AJAX is specified as post but Content-type is not set or keys are not specified

　　Problems prone to errors

1 for objects created using XMLHttpRequest, including ie7+, properties are strictly case-sensitive, be sure to note the case, or not to distinguish size, the property value is undefined. As readystate written readystate,responsetext written responsetext.

2 for IE browser, if the first Judge ActiveXObject, then will perform ActiveXObject create XHR objects, using ACX created XHR objects, properties, events, methods are case-insensitive

3 when creating with XMLHttpRequest, the onreadystatechange must all be lowercase, or it is equivalent to assigning a custom attribute to the XHR object instead of the actual state conversion function. This will never perform a callback. For IE XHR objects created with ActiveXObject, case-insensitive

4) with 2, 3 points, XMLHttpRequest when created, the calling method must be case-sensitive, without error, the hint cannot find the method. IE uses ActiveXObject to create a case-insensitive case.

In particular, you must call the Open method before you can execute the setRequestHeader method without error.

　　Some suggestions for handwritten Ajax code

1 when submitting for GET, do not need to set Content-type, unless the request is some file that needs to check Content-type generate some corresponding data format. WebService, such as ASP.net, checks for content-type and generates a corresponding JSON-formatted string if Content-type is Application/json.

2 If no data is submitted for GET, it is best to add a null as an argument when calling the Send method. Xhr.send (NULL);

3 when submitting for post, be sure not to forget to call the setRequestHeader method setting Content-type as application/x-www-form-urlencoded after calling the Open method

4 when using Responsetext,responsexml and Responsebody "IE only", the status attribute needs to be ==200 "online test" or status state in Readystate==4,status state ==0 Use when "Local test"

JavaScript Code

 var xhr = window. XMLHttpRequest? New XMLHttpRequest (): New ActiveXObject ("Microsft.xmlhttp");
   Xhr.open (' Get ', ' index.html ', true);
   Xhr.onreadystatechange = function () {
     if (4 = xhr.readystate) {
       if (= = Xhr.status | | 0 = = xhr.status) {
         ========= normal return processing code
       }
       Else alert (' dynamic page problem ~ ~ ');
     }
   Xhr.send (NULL);

5 If you are performing asynchronously, you need to add a state conversion function, and then use ResponseText or Responsexml properties at readystate bit 4 o'clock.
If you are performing synchronously, you can use the ResponseText or Responsexml properties directly after the send, and you do not need to add the onReadyStateChange State conversion function. However, for synchronization, if the slow speed of the browser caused by animation, the user experience is not good.

6 The simplest ~~hoho~~ switch to the jquery framework.