jQuery dateRangePicker插件使用方法详解

jQuery dateRangePicker插件使用总结。

版本说明:

当前使用版本:2.1.25

特别说明:版本不同,部分api可能会发生变化,需要引起重点关注

效果

关键代码片段

显示第几周 timePicker : true,//是否显示小时和分钟 timePickerIncrement : 60,//时间的增量,单位为分钟 timePicker12Hour : false,//是否使用12小时制来显示时间 ranges : { '最近1小时': [moment().subtract(1,'hours'),moment()],'今日': [moment().startOf('day'),'昨日': [moment().subtract(1,'days').startOf('day'),moment().subtract(1,'days').endOf('day')],'最近7日': [moment().subtract(6,'days'),'最近30日': [moment().subtract(29,moment()] },opens : 'right',//日期选择框的弹出位置 buttonClasses : ['btn btn-default'],applyClass : 'btn-small btn-primary blue',cancelClass : 'btn-small',locale : { applyLabel : '确定',cancelLabel : '取消',fromLabel : '起始时间',toLabel : '结束时间',customRangeLabel : '自定义',daysOfWeek : [ '日','一','二','三','四','五','六' ],monthNames : [ '一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月' ],firstDay : 1 } },function(start,end,label) { // 格式化日期显示框 $("#dateTimeRange span").html(start.subtract(1,'hours').format('YYYY-MM-DD HH:mm') + '~' + end.format('YYYY-MM-DD HH:mm')); });

html:

时间段:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

相关文章

jQuery插件的种类 1、封装对象方法 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进...
扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间。 入门 编写一个jQuery插件开始于给...
最近项目中需要实现3D图片层叠旋转木马切换的效果,于是用到了jquery.roundabout.js。 兼容性如图: ht...
一、什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异...
AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一...