常用的js插件

一、SuperSlide插件

  SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。
网站上常用的“焦点图/幻灯片”“Tab标签切换”“图片滚动”“无缝滚动”等只需要一个SuperSlide即可解决!
从此无需网上苦苦寻觅特效,无需加载n个插件,无需害怕代码冲突,你需要的只是一个SuperSlide!

二、Jquery插件

 jQuery是一个快速,小巧,功能丰富的JavaScript库。它通过易于使用的API在大量浏览器中运行,使得HTML文档遍历和操作,事件处理,动画和Ajax变得更加简单。通过多功能性和可扩展性的结合,jQuery改变了数百万人编写JavaScript的方式。

三、util.js Ajax请求辅助对象工具插件(自己写的)

//====================通用函数====================

/**
 * AJAX请求辅助对象
 */
var ajax = {};

/**
 * AJAX请求
 * 
 * @param {Object} data
 *            参数
 */
ajax.request = function(data) {
    if (data) {
        var options = {
            type: "post",
            error: ajax.errorCallBack
        };
        $.ajax($.extend(options, data));
    }
};

/**
 * JSON参数请求
 * 
 * @param {Object} data
 *            参数
 */
ajax.jsonRequest = function(data) {
    if (data) {
        if (data.data) {
            data.data = { json : JSON.stringify(data.data) };
        }
        ajax.request(data);
    }
};

/**
 * jsonp跨域请求
 * 
 * @param {Object} data
 *            参数
 */
ajax.jsonp = function(data) {
    if (data) {
        var options = {
            type: "get",
            dataType: "jsonp",
            jsonp: "callback",
            error: ajax.errorCallBack
        };
        ajax.request($.extend(options, data));
    }
};

/**
 * 代理页面地址
 */
ajax.proxyUrl = "proxy/proxy.jsp";

/**
 * AJAX代理请求
 * 
 * @param {Object} data
 *            参数
 */
ajax.proxy = function(data) {
    if (data) {
        var options = {
            url: ajax.proxyUrl + "?" + data.url,
            type: "get",
            error: ajax.errorCallBack
        };
        delete data.url;
        ajax.request($.extend(options, data));
    }
};

/**
 * AJAX请求失败缺省回调函数
 * 
 * @param {Object} XMLHttpRequest
 *            请求对象
 * @param {String} textStatus
 *            状态
 * @param {String} errorThrown
 *            抛出错误
 */
ajax.errorCallBack = function(XMLHttpRequest, textStatus, errorThrown) {
    var title = "服务器异常!";
    /*switch (XMLHttpRequest.status) {
        
    }*/
    common.alert(title, XMLHttpRequest.responseText);
};

/**
 * 将表单数据序列化成JSON对象
 * 
 * @param {String} form
 *            表单jquery选择器
 * @returns {Object} 表单JSON对象
 */
ajax.serialize = function(form) {
    var data = {};
    if (form) {
        var fields = $(form).serializeArray();
        if (fields && fields.length) {
            $.each(fields, function(index, item) {
                data[item.name] = item.value;
            });
        }
    }
    return data;
};

/**
 * 基础通用辅助对象
 */
var common = {};

/**
 * 将表单数据序列化成JSON对象
 * 
 * @param {String} form
 *            表单jquery选择器
 * @returns {Object} 表单JSON对象
 */
common.serialize = function(form) {
    var data = {};
    if (form) {
        var fields = $(form).serializeArray();
        if (fields && fields.length) {
            $.each(fields, function(index, item) {
                data[item.name] = item.value;
            });
        }
    }
    return data;
};

/**
 * 将请求参数对象封装到url中
 * 
 * @param {String} url
 *             文件路径
 * @param {Object} param
 *             参数对象
 * @return {String} 封装后的url
 */
common.parseParam = function(url, param) {
    var urlArr = [url]; 
    if (param) {
        var paramArr = [];
        for (var key in param) {
            paramArr.push(key + "=" + param[key]);
        }
        if (paramArr.length > 0) {
            urlArr.push(url.lastIndexOf("?") == -1 ? "?" : "&");
            urlArr.push(paramArr.join("&"));
        }
    }
    return urlArr.join("");
};

/**
 * 文件下载
 * 
 * @param {String} url
 *             文件路径
 */
common.download = function(url) {
    var form = $("<form method=\"post\" action=\"" + url + "\"></form>");
    $("body").append(form);
    form.submit();
    form.remove();
};

/**
 * 根据文件后缀判断文件是否为图片
 * 
 * @param {String} type
 *             文件后缀
 */
common.isImg = function(type) {
    if (type) {
        var suffix = type.toUpperCase();
        return suffix == "BMP"
            || suffix == "JPG"
            || suffix == "JPEG"
            || suffix == "PNG"
            || suffix == "GIF";
    }
    return false;
};

/**
 * 弹出信息提示框
 * 
 * @param {String} info
 *            提示信息
 */
common.alert = function(title, info) {
    if (layer) {
        layer.alert(info, {icon: 5, title: title});
    } else {
        alert(title);
    }
};

/**
 * 日期格式化函数
 * 
 * @param {Date} date
 *            日期
 * @param {String} format
 *            日期格式
 * @returns {String} 日期字符串
 */
common.dateFormat = function(date, format) {
    format = format || "yyyy-MM-dd hh:mm:ss";
    var o = {
        "M+": date.getMonth() + 1,
        "d+": date.getDate(),
        "h+": date.getHours(),
        "m+": date.getMinutes(),
        "s+": date.getSeconds(),
        "q+": Math.floor((date.getMonth() + 3) / 3),
        "S": date.getMilliseconds()
    };
    if (/(y+)/.test(format)) {
        format = format.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
    }
    for (var k in o) {
        if (new RegExp("(" + k + ")").test(format)) {
            format = format.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        }
    }
    return format;
};

/**
 * 获取日期数值
 * 
 * @param {Any}
 *            value 日期值
 * @returns {Number} 日期数值
 */
common.dateParse = function(value) {
    return typeof value === "number" ? value : Date.parse(value.replace(/-/g, "/"));
};

/**
 * 将数据转为日期对象
 * 
 * @param {Any}
 *            value 日期值
 * @returns {Date} 日期对象
 */
common.toDate = function(value) {
    return new Date(common.dateParse(value));
};

/**
 * 日期单位数值增加
 * 
 * @param {Date}
 *            date 日期对象
 * @param {String}
 *            unit 单位标识(y:年,M:月,d:日,h:时,m:分,s:秒,S:毫秒)
 * @param {Integer}
 *            value 增加数值
 */
common.addDate = function(date, unit, value) {
    if (date && unit && value) {
        value = isNaN(value) ? 0 : value * 1;
        switch (unit) {
            case "y":
                date.setFullYear(date.getFullYear() + value);
                break;
            case "M":
                date.setMonth(date.getMonth() + value);
                break;
            case "d":
                date.setDate(date.getDate() + value);
                break;
            case "h":
                date.setHours(date.getHours() + value);
                break;
            case "m":
                date.setMinutes(date.getMinutes() + value);
                break;
            case "s":
                date.setSeconds(date.getSeconds() + value);
                break;
            case "S":
                date.setMilliseconds(date.getMilliseconds() + value);
                break;
        }
    }
};

/**
 * 日期单位数值减少
 * 
 * @param {Date}
 *            date 日期对象
 * @param {String}
 *            unit 单位标识(y:年,M:月,d:日,h:时,m:分,s:秒,S:毫秒)
 * @param {Integer}
 *            value 减少数值
 */
common.reduceDate = function(date, unit, value) {
    if (date && unit && value) {
        value = isNaN(value) ? 0 : value * 1;
        switch (unit) {
            case "y":
                date.setFullYear(date.getFullYear() - value);
                break;
            case "M":
                date.setMonth(date.getMonth() - value);
                break;
            case "d":
                date.setDate(date.getDate() - value);
                break;
            case "h":
                date.setHours(date.getHours() - value);
                break;
            case "m":
                date.setMinutes(date.getMinutes() - value);
                break;
            case "s":
                date.setSeconds(date.getSeconds() - value);
                break;
            case "S":
                date.setMilliseconds(date.getMilliseconds() - value);
                break;
        }
    }
};

/**
 * 获取UUID
 * 
 * @returns {String} UUID
 */
common.uuid = function() {
    var s = [];
    var hexDigits = "0123456789abcdef";
    for ( var i = 0; i < 36; i++) {
        s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
    }
    s[14] = "4";
    s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
    s[8] = s[13] = s[18] = s[23] = "-";
    return s.join("").replace(/-/g, "").toUpperCase();
};

/**
 * 获取跳转参数
 * 
 * @param {String} param
 *            参数名
 * @returns {String} 参数值
 */
common.getRequestParam = function(param) { 
    var href = window.document.location.href; 
    var index = href.indexOf("?"); 
    var paramStr = href.substr(index + 1);
    var paramArr = paramStr.split("&"); 
    for (var i = 0; i < paramArr.length; i++) { 
        var itemArr = paramArr[i].split("="); 
        if (itemArr[0].toUpperCase() == param.toUpperCase()) {
            return itemArr[1];
        }
    } 
    return null; 
};

/**
 * HTML页面路由
 * 
 * @param {Object} data
 *            传递参数
 */
common.route = function(data) {
    if (data) {
        var options = {
            success: function(result) {
                common.routeParam = data.param ? data.param : null;
                if (data.callback) {
                    data.callback(result);
                } else if (data.container) {
                    $(data.container).html(result);
                }
            }
        };
        ajax.request($.extend(options, data));
    }
};

/**
 * 路由传递的参数
 */
common.routeParam = null;

/**
 * 引入HTML、JS、CSS文件
 * 
 * @param {String|Array} 
 *                 path 文件路径
 * @param {Function} callback
 *            HTML文件加载成功后的回调函数
 */
common.importFile = function(path, callback) {
    if (path) {
        var content = "";
        if (common.isArray(path)) {
            var tags = [];
            for (var i = 0; i < path.length; i++) {
                tags.push(getTag(path[i]));
            }
            content = tags.join("");
        } else if (common.typeOf(path, "string")) {
            content = getTag(path);
        }
        document.writeln(content);
    }
    function getTag(url) {
        var tag = "";
        url = $.trim(url);
        var suffix = url.substr(url.lastIndexOf(".") + 1);
        switch (suffix) {
            case "html":
                var count = 0;
                common.route({
                    url: url,
                    callback: function(html) {
                        document.writeln(html);
                        count++;
                        if (common.typeOf(path, "string") || count == path.length) {
                            callback && callback();
                        }
                    }
                });
                break;
            case "js":
                tag = "<script type=\"text/javascript\" src=\"" + url + "\"></script>";
                break;
            case "css":
                tag = "<link rel=\"stylesheet\" type=\"text/css\" href=\"" + url + "\"/>";
                break;
        }
        return tag;
    }
};

/**
 * 将数据自动装入表单元素中
 * 
 * @param {DOM} form
 *            表单
 * @param {Object} data
 *            数据
 */
common.formData = function(form, data) {
    if (form && data) {
        for (var key in data) {
            var dom =  $(form).find("[name=" + key + "]");
            if (!$.isFunction(data[key]) && dom.length) {
                dom.val(data[key]);
            }
        }
    }
};

/**
 * 保留小数位
 * 
 * @param {Number} decimal
 *            数值
 * @param {Integer} bit
 *            位数
 * @returns {Number} 变更后的数值
 */
common.ellipsisDecimal = function(decimal, bit) {
    decimal += "";
    var index = decimal.indexOf(".");
    if (index != -1 && decimal.substr(index + 1).length > bit) {
        var end = index + 1 + bit;
        decimal = decimal.substring(0, end);
    }
    return parseFloat(decimal);
};

/**
 * 对象类型是否匹配
 * 
 * @param {Any}
 *            object 对象
 * @param {String}
 *            type 类型
 * @returns {Boolean} 是否匹配
 */
common.typeOf = function(object, type) {
    return typeof object === type;
};

/**
 * 对象类型是否为数组
 * 
 * @param {Any}
 *            object 对象
 * @returns {Boolean} 是否为数组
 */
common.isArray = function(object) {
    return Object.prototype.toString.call(object) === "[object Array]";
};

/**
 * 页面全屏显示
 * 
 * @param {Document}
 *            dom dom对象
 * @returns {Boolean} 是否全屏
 */
common.fullScreen = function(dom) {
    if (!document.fullscreenElement &&
              !document.msFullscreenElement &&
            !document.mozFullScreenElement &&
              !document.webkitFullscreenElement) {
        dom = dom || document.documentElement;
        if (dom.requestFullscreen) {
            dom.requestFullscreen();
        } else if (dom.msRequestFullscreen) {
            dom.msRequestFullscreen();
        } else if (dom.mozRequestFullScreen) {
            dom.mozRequestFullScreen();
        } else if (dom.webkitRequestFullscreen) {
            dom.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
        }
        return true;
    } else {
        if (document.exitFullscreen) {
            document.exitFullscreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitExitFullscreen) {
            document.webkitExitFullscreen();
        }
        return false;
    }
};

/**
 * 对象克隆
 * 
 * @param {Any}
 *            obj 源对象
 * @returns {Any} 克隆对象
 */
common.clone = function(obj) {
    if (obj) {
        if ($.isPlainObject(obj)) {
            return $.extend(true, {}, obj);
        } else if ($.isArray(obj)) {
            return obj.concat();
        }
    }
    return null;
};

/**
 * WebSocket处理器
 * 
 * @param {String}
 *                 url 服务端URL地址
 * @param {Function}
 *                 onmessage 收到服务端消息回调函数
 * @param {Function}
 *                 onopen 与服务端连接成功回调函数
 * @param {Function}
 *                 onclose 与服务端连接关闭回调函数
 * @param {Function}
 *                 onerror 与服务端连接发生错误回调函数
 * @param {Function}
 *                 onbeforeunload 当前浏览器窗口已关闭回调函数
 */
var WebSocketHandler = function(url, onmessage, onopen, onclose, onerror, onbeforeunload) {

    /**
     * WebSocket处理器对象
     */
    var _this = this;

    /**
     * WebSocket初始化方法
     */
    _this._init = function() {
        if ("WebSocket" in window) {
            if (url) {
                _this.webSocket = new WebSocket(url);
                onmessage && (_this.webSocket.onmessage = onmessage);
                onopen && (_this.webSocket.onopen = onopen);
                onclose && (_this.webSocket.onclose = onclose);
                _this.webSocket.onerror = onerror ? onerror : function(event) {
                    console.log(event);
                };
                window.onbeforeunload = onbeforeunload ? onbeforeunload : function(event) {
                    _this.webSocket.close();
                };
            } else {
                common.alert("未设置URL地址");
            }
        } else {
            common.alert("当前浏览器 不支持 WebSocket");
        }
    };

    /**
     * 发送消息到服务端
     * 
     * @param {String} 
     *                 message 消息
     */
    _this.send = function(message) {
        _this.webSocket && message && _this.webSocket.send(message);
    };

    /**
     * 关闭当前连接
     */
    _this.close = function() {
        _this.webSocket && _this.webSocket.close();
    };

    /**
     * 设置接收消息的回调函数
     * 
     * @param {Function} 
     *                 onmessage 回调函数
     */
    _this.setOnMessage = function(onmessage) {
        _this.webSocket && onmessage && (_this.webSocket.onmessage = onmessage);
    };

    /**
     * 设置与服务端连接成功的回调函数
     * 
     * @param {Function} 
     *                 onopen 回调函数
     */
    _this.setOnOpen = function(onopen) {
        _this.webSocket && onopen && (_this.webSocket.onopen = onopen);
    };

    /**
     * 设置与服务端连接关闭的回调函数
     * 
     * @param {Function} 
     *                 onclose 回调函数
     */
    _this.setOnClose = function(onclose) {
        _this.webSocket && onclose && (_this.webSocket.onclose = onclose);
    };

    /**
     * 设置连接发生错误的回调函数
     * 
     * @param {Function} 
     *                 onerror 回调函数
     */
    _this.setOnError = function(onerror) {
        _this.webSocket && onerror && (_this.webSocket.onerror = onerror);
    };

    /**
     * 设置当前浏览器窗口已关闭的回调函数
     * 
     * @param {Function} 
     *                 onbeforeunload 回调函数
     */
    _this.setOnBeforeUnload = function(onbeforeunload) {
        onbeforeunload && (window.onbeforeunload = onbeforeunload);
    };

    /**
     * 执行初始化
     */
    _this._init();
};

四、config.js 接口服务器地址配置

/**
 * 服务端接口配置对象
 */
var config = {};

/**
 * 公共数据缓存对象
 */
var cache = {};

/**
 * 系统公共函数
 */
var system = {};


(function() {

    /**
     * 应用服务对象
     */
    config.severImg= {};
    config.Websever= {};
    config.sever= {};

    /**
     * 接口服务地址
     */
    //config.sever.path = "http://localhost:8080/a/";
    config.severImg.path = "http://localhost:8080";

    config.sever.path = "http://localhost:8080/a/";
    //config.sever.path = "http://localhost:8080/a/";
    //config.severImg.path = "http://localhost:8080/";

    config.Websever.path="http://localhost:8081/";
})();

 

posted @ 2019-05-06 15:29  zty_2018  阅读(1342)  评论(0编辑  收藏  举报