Self-encapsulated Ajax

In the past, many Ajax technologies such as Ext, prototype, and jquery were used, but they are all open-source and encapsulated Ajax frameworks. I have never used pure Ajax, So I encapsulated an Ajax framework by referring to the prototyp object-oriented idea. Hope to give readers reference, help and comments. CopyCode The Code is as follows :/*
* Self-encapsulated Ajax
*
*
* @ Author Jiang song
* @ Version 1.00 $ Date:
*
* History:
*
*/
Object. Extend = function (destination, source ){
For (VAR property in source ){
Destination [property] = source [property];
}
Return destination;
};
Object. Extend (string. prototype ,{
Include: function (pattern ){
Return this. indexof (pattern)>-1;
},
Startswith: function (pattern ){
Return this. indexof (pattern) = 0;
},
Endswith: function (pattern ){
Return this. lastindexof (pattern) = (this. Length-pattern. Length );
},
Empty: function (){
Return/^ \ s * $/. Test (this) | this = undefined | this = NULL;
}
});
Object. Extend (array. prototype ,{
Each: function (iterator ){
Try {
For (VAR I = 0, length = This. length; I <length; I ++ ){
Iterator (this [I]);
}
} Catch (e ){
If (E! = 'Break') {Throw e };
}
},
Clear: function (){
This. Length = 0;
Return this;
},
First: function (){
Return this [0];
},
Last: function (){
Return this [This. Length-1];
},
Indexof: function (object ){
For (VAR I = 0, length = This. length; I <length; I ++ ){
If (this [I] = Object) {return I };
}
Return-1;
},
Size: function (){
Return this. length;
},
Include: function (object ){
VaR found = false;
This. Each (function (value ){
If (value = Object) {found = true; throw 'Break ';}
});
Return found;
}
});
Function $ (element ){
If (arguments. length> 1 ){
For (VAR I = 0, elements = [], length = arguments. length; I <length; I ++ ){
Elements. Push ($ (arguments [I]);
}
Return elements;
}
If (typeof element = 'string '){
Element = Document. getelementbyid (element );
}
Return element;
};
VaR Ajax = {
Transport: new object (),
Options: new object (),
Gettransport: function (){
If (window. activexobject ){
Try {
Return new activexobject ('msxm12. xmlhttp ');
} Catch (e ){
Try {
Return new activexobject ('Microsoft. xmlhttp ');
} Catch (e ){}
}
} Else if (window. XMLHttpRequest ){
Try {
Return new XMLHttpRequest ();
} Catch (e ){}
}
},
Setoptions: function (options ){
Ajax. Options = {
Method: 'get ',
Asynchronous: True,
Contenttype: 'application/X-WWW-form-urlencoded ',
Encoding: 'utf-8 ',
Parameters :''
};
Object. Extend (Ajax. Options, options );
Ajax. Options. method = Ajax. Options. method. touppercase ();
},
Request: function (URL, options ){
Ajax. Transport = Ajax. gettransport ();
Ajax. setoptions (options );
This. method = Ajax. Options. method;
VaR Params = Ajax. Options. parameters;
If (! ['Get', 'post']. Include (this. Method )){
This. method = 'get ';
}
If (this. Method = 'get '){
Url = Ajax. setparameters (URL, Params );
}
Try {
Ajax. Transport. Open (this. method, URL, Ajax. Options. asynchronous );
Ajax. Transport. onreadystatechange = Ajax. statechange;
Ajax. setrequestheaders ();
This. Body = This. Method = 'post '? Params: NULL;
Ajax. Transport. Send (this. Body );
} Catch (e ){}
},
Statechange: function (){
Try {
VaR readystate = Ajax. Transport. readystate;
If (readystate = 4 ){
VaR status = Ajax. Transport. Status, transport = Ajax, JSON = Ajax. evaljson ();
If (status = 200 ){
Ajax. Options ['onsuccess'] (transport, JSON );
} Else {
Ajax. Options ['onfailure'] (transport, JSON );
}
}
} Catch (e ){}
},
Setparameters: function (URL, Params ){
If (Params & typeof Params = 'string '){
URL + = (URL. Include ('? ')? '&':'? ') + Params;
} Else if (Params & typeof Params = 'object '){
For (VAR Param in Params ){
URL + = (URL. Include ('? ')? '&':'? ') + Param +' = '+ Params [Param];
}
}
Return URL;
},
Setrequestheaders: function (){
VaR headers = {
'X-requested-with': 'xmlhttprequest ',
'Accept': 'application/XML, text/XML, text/html, text/JavaScript, application/JavaScript, application/JSON, text/JavaScript, text/plain, */*',
'If-modified-since ': 'thu, 01 Jan 1970 00:00:00 gmt'
};
This. method = Ajax. Options. method;
If (this. Method = 'post '){
Headers ['content-type'] = Ajax. Options. contenttype +
(Ajax. Options. encoding? '; Charset =' + Ajax. Options. encoding :'');
If (Ajax. Transport. overridemimetype &&
(Navigator. useragent. Match (/gecko \/(\ D {4})/) | [2005]) [1] <){
Headers ['connection'] = 'close ';
}
}
For (VAR name in headers ){
Ajax. Transport. setRequestHeader (name, headers [name]);
}
},
Evaljson: function (){
Try {
Return eval ('+ Ajax. Transport. responsetext + ')');
} Catch (e ){}
}
};
VaR form = {
Serialize: function (element ){
VaR elements = $ (element). All;
VaR querycomponents = [];
For (VAR I = 0; I <elements. length; I ++ ){
VaR parameter = NULL, method = elements [I]. tagname. tolowercase ();
If (['input', 'select', 'textarea ']. Include (method )){
Parameter = form. serializers [Method] (elements [I]);
}
If (parameter! = NULL & parameter. constructor = array ){
Var key = encodeuricomponent (parameter [0]);
VaR value = encodeuricomponent (parameter [1]);
Querycomponents. Push (Key + '=' + value );
}
}
Return querycomponents. Join ('&');
},
Request: function (options ){
VaR Params = This. toqueryparams (options. Parameters );
Options. Parameters = This. serialize (this. form );
If (Params ){
Options. Parameters = options. Parameters. Concat ('&' + Params );
}
If ($ (this. Form). Method ){
Options. method = $ (this. Form). method;
}
Return new Ajax. Request ($ (this. Form). Action, options );
},
Toqueryparams: function (Params ){
VaR querycomponents = [];
If (Params & typeof Params = 'string '){
Querycomponents. Push (encodeuricomponent (Params ));
} Else if (Params & typeof Params = 'object '){
For (VAR Param in Params ){
Var key = encodeuricomponent (PARAM );
VaR value = encodeuricomponent (Params [Param]);
Querycomponents. Push (Key + '=' + value );
}
}
Return querycomponents. Join ('&');
}
};
Form. serializers = {
Input: function (element ){
Switch (element. type. tolowercase ()){
Case 'checkbox ':
Case 'Radio ':
Return this. inputselector (element );
Default:
Return this. textarea (element );
}
},
Inputselector: function (element ){
If (element. Checked ){
Return [element. Name, element. value];
}
},
Textarea: function (element ){
Return [element. Name, element. value];
},
Select: function (element ){
Return this [element. type = 'select-one '?
'Selectone': 'selectone'] (element );
},
Selectone: function (element ){
VaR value = NULL, option, Index = element. selectedindex;
If (index> = 0 ){
Option = element. Options [Index];
Value = option. value = (undefined | '')? Option. Text: option. value;
}
Return [element. Name, value];
},
Selectparameters: function (element ){
VaR value = [];
For (VAR I = 0; I <element. length; I ++ ){
VaR option = element. Options [I];
If (option. Selected ){
VaR optvalue = option. value = (undefined | '')? Option. Text: option. value;
Value. Push (optvalue );
}
}
Return [element. Name, value];
}
};
Function $ F (element ){
This. form = element;
}
Object. Extend ($ F. prototype, form );
/*************************************** ***********************
* Test functions
*/
Function ontest (){
// Get submission method
VaR Params = new object ();
Params. Ss = 'zhang san ';
New Ajax. Request ('ajax. do? Method = doget ',{
Onsuccess: function (Transport ){
Alert (transport. evaljson (). xx)
},
Parameters: Params
});
// Post form submission method
VaR Params = new object ();
Params. IDD = 1000;
Params. Names = 'zhangsan'
New $ F ('form'). Request ({
Onsuccess: function (Transport ){
Alert (transport. evaljson (). xx );
},
Parameters: Params
});
}