Html5添加用户选择一个日期时间范围的日期选择器插件教程

时间：2016-01-08 10:29:26 阅读：203 评论：0 收藏：0 [点我收藏+]

标签：

一、使用方法
<link rel="stylesheet" href="daterangepicker.css" />
<script src="moment.min.js"></script>
<script src="jquery.daterangepicker.js"></script>

二、调用插件
$(’#dom-id’).dateRangePicker(configObject);

三、配置参数
{
format: ’YYYY-MM-DD’,
separator: ’ to ’,
language: ’auto’,
startOfWeek: ’sunday’,//or monday
getValue: function()
{
return this.value;
},
setValue: function(s)
{
this.value=s;
},
startDate: false,
endDate: false,
minDays: 0,
maxDays: 0,
showShortcuts: true,
time:{
enabled: false
},
shortcuts:
{
’next-days’:[3,5,7],
’next’ :[’week’,’month’,’year’]
},
customShortcuts : [],
inline:false,
container: ’body’,
alwaysOpen:false,
singleDate:false,
batchMode:false,
beforeShowDay: [function],
dayDivAttrs: [],
dayTdAttrs: [],
applyBtnClass: ’’
}

四、事件
$(’#dom-id’)
.dateRangePicker()
.bind(’datepicker-change’,function(event,obj)
{
console.log(obj);
})
.bind(’datepicker-apply’,function(event,obj)
{
console.log(obj);
})
.bind(’datepicker-close’,function()
{
console.log(’close’);
});

五、API
$(dom).data(’dateRangePicker’)
.setDateRange(’2013-11-20’,’2013-11-25’);
.clear();
.close();
.open();
.destroy();


应用推广KeyMob移动端广告平台，国内专业的“管理工具”一站式移动营销应用推广平台。致力于为广告主提供基于移动营销广告进行高效的优化管理服务。

标签：

踩

(0)

评论一句话评论（0）

key

加入时间：2016-01-05

关注此人发短消息

文章分类

默认分类（277）

“key”关注的人------（0）

“key”的粉丝们------（0）