jQuery 扩展功能
源码如下:
/*!
* 说明:Jquery库扩展
* 创建时间: leo 2016/10/13
*/ (function (window, jQuery, undefined) {
jQuery.extend({ /*日期时间处理*/
// data参数的格式为日期格式
date: {
// 添加/减去月份 num为正就是加 为负就是减
countMonth: function(date, num){
var oDate, oMonth, oDay;
oDate = new Date(date);
oDay = oDate.getDate();
oDate.setDate(1);
oDate.setMonth(oDate.getMonth() + num);
oMonth = oDate.getMonth() + 1;
oDay = $.date.getLastDay(oDate.getFullYear(), oDate.getMonth() + 1);
return oDate.getFullYear() + '-' + (oMonth < 10 ? '0' : '') + oMonth + '-' + (oDay < 10 ? '0' : '') + oDay;
}, // 获取最后一天
getLastDay: function(year, month){
var oDt;
oDt = new Date(year, month - 1, '01');
oDt.setDate(1);
oDt.setMonth(oDt.getMonth() + 1);
return new Date(oDt.getTime() - 1000*60*60*24).getDate();
}, // 计算 date1 - date2 得到相差天数
countDay: function (date1, date2) {
return parseInt(Math.abs(new Date(date1) - new Date(date2)) / 86400000); //把相差的毫秒数转换为天数
},
}, /*操作*/
do: {
// 指定 setTimeout 执行的次数 默认时间1秒 次数5次
setTimeoutWidthNum: function (fun, time = 1000, num = 5) {
if (fun != null) {
setTimeout(function () {
fun();
num --;
if (num > 0)
$.action.setTimeoutWidthNum(fun, time, num);
}, time);
}
}, // 处理多行文本溢出 末尾显示省略号 html布局限制
textOverflow: function (obj) {
var oH, oText;
oH = $(obj).height();
oText = $(obj).children();
while (oText.outerHeight() > oH) {
oText.html(oText.html().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
}
}, // 删除数组里某个元素
removeItem: function (arr, item) {
if (arr.length) {
var index = arr.indexOf(item);
if (index > -1) arr.splice(index, 1);
}
}
}, //定位
position: {
//使页面元素居中 isTure1代表是否左右居中 isTure2代表是否垂直居中 默认上下垂直居中
center: function (el, isTure1 = true, isTure2 = true) {
var obj = $(el);
if (obj.length > 0) {
obj.each(function () {
var _this, oW, oH;
_this = $(this);
oW = _this.width();
oH = _this.height();
_this.css('position', 'absolute');
if (isTure1) _this.css({ left: '50%', marginLeft: - oW / 2 });
if (isTure2) _this.css({ top: '50%', marginTop: - oH / 2 });
})
}
}
}, /*浏览器*/
browser: {
// 设置名称为name 值为value的Cookie value为空就移除Cookie 保存时间默认3天
setCookie: function (name, value, time = 3 * 24 * 60 * 60 * 1000) {
if (value == '') time = 0;
var expdate = new Date(); //初始化时间
expdate.setTime(expdate.getTime() + time); //时间
document.cookie = name + "=" + value + ";expires=" + expdate.toGMTString() + ";path=/";
}, // 获取cookie的value
getCookie: function (cookieName) {
var cookieValue, cookieStartAt, cookieEndAt;
cookieValue = document.cookie;
cookieStartAt = cookieValue.indexOf("" + cookieName + "=");
if (cookieStartAt == -1) cookieStartAt = cookieValue.indexOf(cookieName + "=");
if (cookieStartAt == -1) {
cookieValue = null;
}else {
cookieStartAt = cookieValue.indexOf("=", cookieStartAt) + 1;
cookieEndAt = cookieValue.indexOf(";", cookieStartAt);
if (cookieEndAt == -1) cookieEndAt = cookieValue.length;
cookieValue = unescape(cookieValue.substring(cookieStartAt, cookieEndAt));//解码latin-1
}
return cookieValue;
}, // 获取地址栏特定name的值
getUrlParam: function (name) {
var reg, oName;
reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
oName = window.location.search.substr(1).match(reg);
if (oName != null) return unescape(oName[2]);
return null;
}
},
})
})(window, jQuery)
countMonth 这个函数是为了处理项目中购买数据的时间段,其中用到的 getLastDay 函数是用来获取某年某月有多少天,比较巧妙的运用了setDate(1),然后setMonth()。setTimeoutWidthNum 函数使用了递归的用法,对于 textOverflow 方法可以参考 这里 ,
div 垂直居中是大部分页面弹窗的需求,所以就通过 center 函数把 css 样式,通过 js 赋给 div。Cookie 值的保存、获取、移除也是很多的登录页的需求。
引入时需要先引入jquery.js,例如:
<script type="text/javascript" src="jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="leo.js"></script>
使用时直接调用,例如:$.date.countMonth('2015,10,30', 4)等。
本人会持续更新,谢谢支持 \(^o^)/~
jQuery 扩展功能的更多相关文章
- jQuery && jEasyUI 扩展功能集合
jquery-extensions:jQuery && jEasyUI 扩展功能集合 该扩展功能基于 jQuery 1.9.x / 1.10.x / 1.11.x 和 jQuery E ...
- jQuery的动画以及扩展功能
动画DOM及CSS操作 自定义动画 animate(最终css状态,时间) 这个最终css状态是一个对象 <!DOCTYPE html> <html lang="en&qu ...
- jQuery 2.0.3 源码分析core - 整体架构
拜读一个开源框架,最想学到的就是设计的思想和实现的技巧. 废话不多说,jquery这么多年了分析都写烂了,老早以前就拜读过, 不过这几年都是做移动端,一直御用zepto, 最近抽出点时间把jquery ...
- 深入学习jQuery选择器系列第二篇——过滤选择器之子元素选择器
× 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 在上一篇中已经介绍过基础选择器和层级选择器,本文开始介绍过滤选择器.过滤选择器是jQuery选择器中最为庞大也是最为 ...
- 第 1 章 jQuery 入门
学习要点: 1.什么是 jQuery 2.学习 jQuery 的条件 3.jQuery 的版本 4.jQuery 的功能和优势 5.其他 JavaScript 库 6.是否兼容低版本 IE 7.下载及 ...
- (转)整体把握jQuery -jQuery 的原型关系图
整体把握jQuery -jQuery 的原型关系图 (原)http://www.html5cn.org/article-6529-1.html 2014-7-2 17:12| 发布者: html5cn ...
- jquery 甘特图开发指南
JQuery.Gantt是一个开源的基于JQuery库的用于实现甘特图效果的可扩展功能的JS组件库. <link rel="stylesheet" href="cs ...
- JS魔法堂:jQuery.Deferred(jQuery1.5-2.1)源码剖析
一.前言 jQuery.Deferred作为1.5的新特性出现在jQuery上,而jQuery.ajax函数也做了相应的调整.因此我们能如下的使用xhr请求调用,并实现事件处理函数晚绑定. var p ...
- 你可能不需要 jQuery!使用原生 JavaScript 进行开发
很多的 JavaScript 开发人员,包括我在内,都很喜欢 jQuery.因为它的简单,因为它有很多丰富的插件可供使用,和其它优秀的工具一样,jQuery 让我们开发人员能够更轻松的开发网站和 We ...
随机推荐
- Oracle 语句常见错误
Merge into的注意点之ORA-30926:无法在源表中获得一组稳定的行? merge into 的内部处理是将table_source 的每一条记录和table_target的每一条记录对比匹 ...
- the OS maintains a number of queues
COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION To do its job, the OS ...
- mybatis 中#{}与${}的区别 (面试题)
MyBatis/Ibatis中#和$的区别 1. #将传入的数据都当成一个字符串,会对自动传入的数据加一个双引号. 如:order by #user_id#,如果传入的值是111,那么解析成sql时的 ...
- CSS3学习(CSS3过渡、CSS3动画)
CSS3过渡:transition属性--专门应对颜色.长度.宽度.位置等变化的过渡 通过CSS3,我们可以在不使用Flash和JavaScript的情况下,为当前某元素从某样式改变为某样式的时候添加 ...
- .Net使用CDO发送邮件,需安装注册的组件
regsvr32 C:\Program Files\Common Files\System\ado\msado15.dll regsvr32 CDOEX.DLL
- docker rabbitmq
docker run -d --hostname my1 --name dome-rabbit -p 15673:5672 -p 15674:15672 -e RABBITMQ_ERLANG_COOK ...
- php判断爬虫
function checkrobot($useragent = ''){ static $kw_spiders = 'Bot|Crawl|Spider|slurp|sohu-search|lycos ...
- python : dictionary changed size during iteration
1. 错误方式 #这里初始化一个dict >>> d = {'a':1, 'b':0, 'c':1, 'd':0} #本意是遍历dict,发现元素的值是0的话,就删掉 >> ...
- JS事件分析
1.注册事件 1.1 使用HTML元素的事件属性 <div id='myDiv' style="width:100px;height:100px;background-color:re ...
- django 笔记
最近开始接触django,一些基本的操作记录于此. 参考链接: http://www.ziqiangxuetang.com/django/django-tutorial.html django安装 s ...