麻烦牛人帮我看下我封装的ajax

Question

我想知道我的代码规范吗？
对于我写的这两个功能有啥需要改进的地方？还请各位牛人不吝赐教 谢谢。
/**
 * @author QinNing
 */
/**
 * 目前只完成 ajax 请求 序列化表单 两个功能
 */
//创建命名空间 J
if(typeof J !="object"){
J={};
}
J.BaseClass=function(){}
J.BaseClass.prototype=new Object();
// 通过使用原型链达到继承的目的
// 基类的继承实现  参数类型为 JSON对象
J.BaseClass.prototype.extend=function(atrs){
//子类构造方法 参数类型为 JSON对象
var child=function(cAtrs){
if(cAtrs !=undefined && typeof cAtrs == "object"){
for(var cAtr in cAtrs){
eval("child.prototype."+cAtr+"=cAtrs."+cAtr);
}
}
}
//继承父类的 extend 以便继续创建子类
child.extend=this.extend;
child.prototype= new this();
for(var atr in atrs){
eval("child.prototype."+atr+"=atrs."+atr);
}
return child;
}
J.BaseClass.extend = J.BaseClass.prototype.extend;//Exception 
J.Exception = J.BaseClass.extend({
message:"未知异常",
setMessage :function (msg){
this.message=msg;
return this;
},
showMessage :function (){
alert(this.message);
}
});
J.RequireException = J.Exception.extend({
message:"不能为空"
});
J.EmailException = J.Exception.extend({
message:"邮箱格式不正确"
});//Ajax
J.Ajax = J.BaseClass.extend({
method : "POST",
async : true,
url : "",
parm:"",
form:"",
init : function (){
if(this.form!=""){
//序列化表单数据填充到 parm
this.parm=J.getValuesToUrl(form)
}
if(this.parm==""){
this.parm="nocacheTime="+new Date().getTime();
}else{
this.parm+="&nocacheTime="+new Date().getTime();
}
},
getXhr : function (){
try {
return new window.XMLHttpRequest();
} catch( e ) {
try{
return new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
return new window.ActiveXObject( "Microsoft.XMLHTTP" );
}catch(e){
return null;
throw new Error("创建XMLHttpRequest失败");
}
}
}
},
success : function (data){

},
fail : function () {
throw new Error("服务器端异常");
},
doBefore : function (){

},
doAfter : function (data){

},
setDoBefore :function (func){
this.doBefore=func;
return this;
},
setDoAfter :function (func){
this.doAfter=func;
return this;
},
setParm : function (parm){
this.parm=parm;
return this;
},
setUrl : function (url){
this.url=url;
return this;
},
setForm : function (form){
this.form=form;
return this;
},
setAsync : function (async){
this.async=async;
return this;
},
setSuccess : function (func){
this.success= func;
return this;
},
setFail : function (func){
this.fail= func;
return this;
},
send:function (){
this.init();
var xhr=this.getXhr();
if(xhr==null){
throw new Error("创建XMLHttpRequest失败");
return;
}
this.doBefore();
var success=this.success;
var doAfter = this.doAfter;
var fail = this.fail;
xhr.onreadystatechange=function (){
if (xhr.readyState == 4) {
if (xhr.status == 200) {
var ret = xhr.responseText;
success(ret);
doAfter(ret);
} else {
fail();
}
}
};
xhr.open(this.method,this.url,this.async);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(this.parm);
}
});
J.Post = J.Ajax.extend({
});
J.Load = J.Ajax.extend({
});
J.load =function (data){
var l=new J.Load(data);
var ob=this;
l.setDoAfter(
function(data){
ob.innerHTML=data;
}
);
l.send();
}
J.post=function (data){
var p=new J.Post(data);
p.send();
}
//参数为节点id 获得节点 目前给节点增加 ajax load方法 当然节点 必须有innerHTML属性
J.get=function (id){
var ob=document.getElementById(id);
ob.load=J.load;
return ob;
}
//参数可以是表单对象 也可以为 表单 id 获得指定[表单]对象的value值
J.getvalue=function (id){
var ele= typeof id =="object" ? id :J.get(id); 
if(!(ele.type in {text:0,password:0,hidden:0,textarea:0,radio:0,checkbox:0,"select-multiple":0,"select-one":0})){
throw new Error("不是有效的表单对象");
}
if(ele.type in {text:0,password:0,hidden:0,radio:0,checkbox:0}){
return ele.value;
}
if(ele.type in {radio:0,checkbox:0}){
if(ele.checked){
return ele.value;
}else{
return "";
}
}
if(ele.type == "textarea"){
return ele.innerHTML;
}
if(ele.type == "select-one"){
for(var i =0 ;i < ele.options.length;i++){
if( ele.options[i].selected){
return ele.options[i].value;
}
}
return "";
}
if(ele.type == "select-multiple"){
var values=new Array();
for(var i =0 ;i < ele.options.length;i++){
if( ele.options[i].selected){
values.push(ele.options[i].value);
}
}
return values;
}
}
//参数可以是form对象 也可以为 form id 将表单数据转换为 json对象 
J.getValues = function (form){
if(typeof form =="string"){
form= J.get(form);
}
var reply={};
for(var index in form.elements){
var ele=form.elements[index];
try{
//{text:0,password:0,hidden:0,radio:0,checkbox:0,"select-multiple":0,"select-one":0}
if(!(ele.type in {text:0,password:0,hidden:0,textarea:0,radio:0,checkbox:0,"select-multiple":0,"select-one":0}))continue;
if(ele.disabled)continue;
if(ele.type in {text:0,password:0,hidden:0,"select-one":0}){
if(form[ele.name].length>0 && ele.type!="select-one"){
if(reply[ele.name]==undefined){
reply[ele.name]=new Array();
}
var values=reply[ele.name];
values.push(ele.value);
reply[ele.name]=values;
}else{
reply[ele.name]=ele.value;
}
continue;
}
if(ele.type =="textarea"){
if(form[ele.name].length>0){
if(reply[ele.name]==undefined){
reply[ele.name]=new Array();
}
var values=reply[ele.name];
values.push(ele.innerHTML);
reply[ele.name]=values;

}else{
reply[ele.name]=ele.innerHTML;
}
continue;
}
if(ele.type =="checkbox"){
if(form[ele.name].length>0){
if(reply[ele.name]==undefined){
reply[ele.name]=new Array();
}
if(ele.checked){
var values=reply[ele.name];
values.push(ele.value);
reply[ele.name]=values;
}
}else{
if(ele.checked){
reply[ele.name]=ele.value;
}
}
continue;
}
if(ele.type == "radio"){
if(ele.checked){
reply[ele.name]=ele.value;
continue;
}
}
if(ele.type == "select-multiple"){
reply[ele.name]=J.getvalue(ele);
}
}catch(e){}
}
return reply;
}
// 将表单数据转换为URL字符串
J.getValuesToUrl = function (form){
return J.JsonToUrlString(J.getValues(form));
}
// 将JSON对象转换为 URL字符串
J.JsonToUrlString=function(json){
var jsonStr="";
for(var atr in json){
if(json[atr].length>0){
for(var i =0; i<json[atr].length;i++){
jsonStr+=atr+"="+json[atr][i]+"&";
}
}else{
jsonStr+=atr+"="+json[atr]+"&";
}
}
return jsonStr.substr(0,jsonStr.length-1);
}
/**
 * 测试 目前只完成 ajax 请求 序列化表单 两个功能
 */
function ajaxDemo(){
/**
 * 第一种 用法
 */
// var p=new J.Post();
// p.setSuccess(function(data){
// alert(data);
// }).setUrl("index.jsp").setParm("name=qq").send();
/**
 * 第二种 用法 
 */
// J.post({
// url: "index.jsp",
// parm:"name=qq",
// success : function (data){alert(data);}
// });
/**
 * 第三种 用法 load针对 element对象load
 */
// J.get("qq").load({
// url:"index.jsp",
// parm:"name=qq"
// });
//序列化表单
alert(J.getValuesToUrl("addRg"));
}

Answer 1

这csdn 的论坛里 代码块显示 简直让人没法看，建议楼主发篇blog~~ 

Answer 2

把楼主的代码格式化了一下，发个好看点的格式： /**
        * @author QinNing
        */
        /**
        * 目前只完成 ajax 请求 序列化表单 两个功能
        */
        //创建命名空间 J
        if (typeof J != "object") {
            J = {};
        }
        J.BaseClass = function () { }
        J.BaseClass.prototype = new Object();
        // 通过使用原型链达到继承的目的
        // 基类的继承实现 参数类型为 JSON对象
        J.BaseClass.prototype.extend = function (atrs) {
            //子类构造方法 参数类型为 JSON对象
            var child = function (cAtrs) {
                if (cAtrs != undefined && typeof cAtrs == "object") {
                    for (var cAtr in cAtrs) {
                        eval("child.prototype." + cAtr + "=cAtrs." + cAtr);
                    }
                }
            }
            //继承父类的 extend 以便继续创建子类
            child.extend = this.extend;
            child.prototype = new this();
            for (var atr in atrs) {
                eval("child.prototype." + atr + "=atrs." + atr);
            }
            return child;
        }
        J.BaseClass.extend = J.BaseClass.prototype.extend;        //Exception  
        J.Exception = J.BaseClass.extend({
            message: "未知异常",
            setMessage: function (msg) {
                this.message = msg;
                return this;
            },
            showMessage: function () {
                alert(this.message);
            }
        });
        J.RequireException = J.Exception.extend({
            message: "不能为空"
        });
        J.EmailException = J.Exception.extend({
            message: "邮箱格式不正确"
        });        //Ajax
        J.Ajax = J.BaseClass.extend({
            method: "POST",
            async: true,
            url: "",
            parm: "",
            form: "",
            init: function () {
                if (this.form != "") {
                    //序列化表单数据填充到 parm
                    this.parm = J.getValuesToUrl(form)
                }
                if (this.parm == "") {
                    this.parm = "nocacheTime=" + new Date().getTime();
                } else {
                    this.parm += "&nocacheTime=" + new Date().getTime();
                }
            },
            getXhr: function () {
                try {
                    return new window.XMLHttpRequest();
                } catch (e) {
                    try {
                        return new ActiveXObject("Msxml2.XMLHTTP");
                    } catch (e) {
                        try {
                            return new window.ActiveXObject("Microsoft.XMLHTTP");
                        } catch (e) {
                            return null;
                            throw new Error("创建XMLHttpRequest失败");
                        }
                    }
                }
            },
            success: function (data) {            },
            fail: function () {
                throw new Error("服务器端异常");
            },
            doBefore: function () {            },
            doAfter: function (data) {            },
            setDoBefore: function (func) {
                this.doBefore = func;
                return this;
            },
            setDoAfter: function (func) {
                this.doAfter = func;
                return this;
            },
            setParm: function (parm) {
                this.parm = parm;
                return this;
            },
            setUrl: function (url) {
                this.url = url;
                return this;
            },
            setForm: function (form) {
                this.form = form;
                return this;
            },
            setAsync: function (async) {
                this.async = async;
                return this;
            },
            setSuccess: function (func) {
                this.success = func;
                return this;
            },
            setFail: function (func) {
                this.fail = func;
                return this;
            },
            send: function () {
                this.init();
                var xhr = this.getXhr();
                if (xhr == null) {
                    throw new Error("创建XMLHttpRequest失败");
                    return;
                }
                this.doBefore();
                var success = this.success;
                var doAfter = this.doAfter;
                var fail = this.fail;
                xhr.onreadystatechange = function () {
                    if (xhr.readyState == 4) {
                        if (xhr.status == 200) {
                            var ret = xhr.responseText;
                            success(ret);
                            doAfter(ret);
                        } else {
                            fail();
                        }
                    }
                };
                xhr.open(this.method, this.url, this.async);
                xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                xhr.send(this.parm);
            }
        });
        J.Post = J.Ajax.extend({
    });
    J.Load = J.Ajax.extend({
});
J.load = function (data) {
    var l = new J.Load(data);
    var ob = this;
    l.setDoAfter(
function (data) {
    ob.innerHTML = data;
}
);
    l.send();
}
J.post = function (data) {
    var p = new J.Post(data);
    p.send();
}
//参数为节点id 获得节点 目前给节点增加 ajax load方法 当然节点 必须有innerHTML属性
J.get = function (id) {
    var ob = document.getElementById(id);
    ob.load = J.load;
    return ob;
}
//参数可以是表单对象 也可以为 表单 id 获得指定[表单]对象的value值
J.getvalue = function (id) {
    var ele = typeof id == "object" ? id : J.get(id);
    if (!(ele.type in { text: 0, password: 0, hidden: 0, textarea: 0, radio: 0, checkbox: 0, "select-multiple": 0, "select-one": 0 })) {
        throw new Error("不是有效的表单对象");
    }
    if (ele.type in { text: 0, password: 0, hidden: 0, radio: 0, checkbox: 0 }) {
        return ele.value;
    }
    if (ele.type in { radio: 0, checkbox: 0 }) {
        if (ele.checked) {
            return ele.value;
        } else {
            return "";
        }
    }
    if (ele.type == "textarea") {
        return ele.innerHTML;
    }
    if (ele.type == "select-one") {
        for (var i = 0; i < ele.options.length; i++) {
            if (ele.options[i].selected) {
                return ele.options[i].value;
            }
        }
        return "";
    }
    if (ele.type == "select-multiple") {
        var values = new Array();
        for (var i = 0; i < ele.options.length; i++) {
            if (ele.options[i].selected) {
                values.push(ele.options[i].value);
            }
        }
        return values;
    }
}

Answer 3

下半部分：//参数可以是form对象 也可以为 form id 将表单数据转换为 json对象  
J.getValues = function (form) {
    if (typeof form == "string") {
        form = J.get(form);
    }
    var reply = {};
    for (var index in form.elements) {
        var ele = form.elements[index];
        try {
            //{text:0,password:0,hidden:0,radio:0,checkbox:0,"select-multiple":0,"select-one":0}
            if (!(ele.type in { text: 0, password: 0, hidden: 0, textarea: 0, radio: 0, checkbox: 0, "select-multiple": 0, "select-one": 0 })) continue;
            if (ele.disabled) continue;
            if (ele.type in { text: 0, password: 0, hidden: 0, "select-one": 0 }) {
                if (form[ele.name].length > 0 && ele.type != "select-one") {
                    if (reply[ele.name] == undefined) {
                        reply[ele.name] = new Array();
                    }
                    var values = reply[ele.name];
                    values.push(ele.value);
                    reply[ele.name] = values;
                } else {
                    reply[ele.name] = ele.value;
                }
                continue;
            }
            if (ele.type == "textarea") {
                if (form[ele.name].length > 0) {
                    if (reply[ele.name] == undefined) {
                        reply[ele.name] = new Array();
                    }
                    var values = reply[ele.name];
                    values.push(ele.innerHTML);
                    reply[ele.name] = values;                } else {
                    reply[ele.name] = ele.innerHTML;
                }
                continue;
            }
            if (ele.type == "checkbox") {
                if (form[ele.name].length > 0) {
                    if (reply[ele.name] == undefined) {
                        reply[ele.name] = new Array();
                    }
                    if (ele.checked) {
                        var values = reply[ele.name];
                        values.push(ele.value);
                        reply[ele.name] = values;
                    }
                } else {
                    if (ele.checked) {
                        reply[ele.name] = ele.value;
                    }
                }
                continue;
            }
            if (ele.type == "radio") {
                if (ele.checked) {
                    reply[ele.name] = ele.value;
                    continue;
                }
            }
            if (ele.type == "select-multiple") {
                reply[ele.name] = J.getvalue(ele);
            }
        } catch (e) { }
    }
    return reply;
}
// 将表单数据转换为URL字符串
J.getValuesToUrl = function (form) {
    return J.JsonToUrlString(J.getValues(form));
}
// 将JSON对象转换为 URL字符串
J.JsonToUrlString = function (json) {
    var jsonStr = "";
    for (var atr in json) {
        if (json[atr].length > 0) {
            for (var i = 0; i < json[atr].length; i++) {
                jsonStr += atr + "=" + json[atr][i] + "&";
            }
        } else {
            jsonStr += atr + "=" + json[atr] + "&";
        }
    }
    return jsonStr.substr(0, jsonStr.length - 1);
}
还限制字符的长度，真的恶心！