常用的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/"; })();