我的开源框架之交互控制、组件通用工具封装

需求：

　　（1）后期的jquery组件具有一些通用的需求，如ajax请求，数组的处理等

　　

　　（2）从系统UI与服务器集成的角度看，一个系统的前端交互需要做一个统一的封装来接受用户交互，同时统一于服务器的请求

　　（3）前端的日志功能需要统一

　　

　　（4）统一的验证入口

　　

　　（5）综上：我们需要一个封装了通用表单操作（表单转对象，对象填充到表单，打开一个窗口），封装系统前端的统一ajax交互，ajax交互返回格式统一以便做统一处理。

初步代码实现（后期将会根据实际需求调整）

/******************************************
*作者:hjwen
*电邮:hjwen88@126.com
*版本：1.0
*说明：myui是与服务器mvc web框架集成的关键,封装了对表单的常用操作，如：表单转对象，ajax统一交互，打开一个窗口等
*      myui也是后期组件的依赖项，组件中用到日志，ajax等功能依赖此对象         
*版权：中国通用开源许可协议V1.0
******************************************/
(function($){
    /****
    *扩展myui到jquery
    ****/
    $.extend({
        myui: {
            version: '1.0',
            release: '2015.05.18',
            isDebug: false,
            /***
           *日志，日志需要对低版本ie做特殊处理
           ****/
            log: function (message) {
                if (this.isDebug) {
                    if (window.console) {
                        window.console.log(typeof message != 'string' ? JSON.stringify(message) : message);
                    } else {
                        alert(typeof message != 'string' ? JSON.stringify(message) : message);
                    }
                }                         
            },
            /***
            * 统一所有的服务器请求
            *@param options={
                            submit:'触发提交的元素id/jq对象',
                            loadingContainer:'提示框对象/id',
                            url:'地址',
                            async:'true/false',
                            type:'post/get',
                            timeout:超时默认值不设置,
                            params:'参数key1=value1&key2=value2 ',
                            dataType:'json/xml/html/text/script' ,//默认json                           
                            okdeal:function(result){alert('返回结果正确的处理');}，
                            faildeal:function(result){alert('返回结果错误处理');},
                            success:function(result){alert('ajax请求成功的处理');},
                            error:function(xhr){alert('ajax请求错误处理')}
                          }
            @return 系统返回的json 格式={code:'状态码，0=处理ok，其他为错误',message:'错误结果时的提示，如果没有错误则为空',data:'返回的数据，string格式，如果是json需要再自行eval'}
            **/
            ajaxRequest: function (options) {
                if (typeof options.url === 'undefined') {
                    alert("options.url未设置！");
                    return;
                }
                var faildeal = function (result) {
                    alert(result.message);
                };
                var okdeal = function (result) {
                };
                if (typeof options.faildeal === 'function')
                    faildeal = options.faildeal;

                if (typeof options.okdeal ==='function')
                    okdeal = options.okdeal;

                var submitObj = null;
                if (typeof options.submit != 'undefined') {
                    if (typeof options.submit === 'string') {
                        submitObj = $(options.submit);
                    } else {
                        submitObj = options.submit;
                    }
                }
                var loadingContainer = null;
                var loadingObj = null;
                if (typeof options.loadingContainer != 'undefined') {
                    if (typeof options.loadingContainer === 'string') {
                        loadingContainer = $(options.loadingContainer);
                    } else {
                        loadingContainer = options.loadingContainer;
                    }
                }
                //设置默认处理
                var ajaxOptDefault = {
                    url:options.url,
                    type: "POST",                   
                    dataType: 'json',
                    async: true,
                    error: function (xhr, status, errorThrown) {
                        if (loadingObj != null)
                            loadingObj.remove();
                        if (submitObj != null)
                            submitObj.removeAttr('disabled');
                        alert("请求发生错误，请您稍后再试！" + xhr.responseText);
                    },
                    success: function (result) {
                        if (loadingObj != null)
                            loadingObj.remove();
                        if (submitObj != null)
                            submitObj.removeAttr('disabled');
                        if (result.code == 0) {
                            okdeal(result.data);
                        } else {
                            faildeal(result);
                        }
                    }
                };               
                if (typeof options.async == 'boolean')
                    ajaxOptDefault.async = options.async;
                if (typeof options.type == 'string')
                    ajaxOptDefault.type = options.type;
                if (typeof options.dataType == 'string')
                    ajaxOptDefault.dataType = options.dataType;
                if (typeof options.timeout == 'number')
                    ajaxOptDefault.timeout = options.timeout;
                if (typeof options.params != 'undefined')
                    ajaxOptDefault.params = options.params;  
                if (typeof options.error === 'functon')
                    ajaxOptDefault.error = options.error;
                if (typeof options.success === 'functon')
                    ajaxOptDefault.success = options.success;
                if (submitObj!=null)
                    submitObj.attr('disabled', 'disabled');
                if (loadingContainer != null)
                    loadingObj=$("<div class='loading icon-loading'>正在加载......</div>").appendTo(loadingContainer);
                $.ajax(ajaxOptDefault);
            },
            /***
            * 某个html标签加载远程html文件
            *options={
            *       target:jquery目标对象,
            *       settings = { url:'远程地址',                      
            *                   load:function(){.........} , //加载前处理事件
            *                   loaded:function(result){.........}  //加载后处理事件       
            *        }
            *   }           
            ***/
            objectLoadContect: function (options) {
                var opts = options.settings;
                if (typeof opts === 'object' && typeof opts.url != 'undefined' && opts.url != '') {
                    options.target.html("<div class='loading icon-loading'>正在加载......</div>");                    
                    if (typeof opts.load === 'function') {
                        opts.load();
                    }                   
                    options.target.load(opts.url, function () {
                        if (typeof opts.loaded === 'function') {
                            opts.loaded(options.target);
                        }
                    });
                }
            },
            /***
            *填充表单
            ****/
            fillForm: function (options) {
            },
            /***
            *表单转json对象
            ****/
            parseForm: function (options) {
            },
            /***
            *重置表单
            ****/
            resetForm: function (options) {
            },
            /**
            *打开窗口 
            ***/
            openWindow: function (options) {
            },
            /***
            * 按下标移除数组元素,返回新数组
            * srcArray:源数组，indexArr:下标数组
            ***/
            removeArrayEle: function (srcArray, indexArr) {
                var newArray = [];                
                for (var i = 0, len = srcArray.length; i < len;++i){
                    var nodel = true;
                    for (var j = 0, len1 = indexArr.length; j < len1; ++j) {
                        if (i == parseInt(indexArr[j]))
                            nodel=false;
                    }
                    if (nodel) {
                        newArray.push(srcArray[i]);
                    }
                }
                return newArray;
            }
        }
    });   
})(jQuery)