原生html写日期范围选择,Html5添加用户选择一个日期时间范围的日期选择器插件教程...

一、使用方法

二、调用插件

$('#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移动端广告平台，国内专业的“管理工具”一站式移动营销应用推广平台。致力于为广告主提供基于移动营销广告进行高效的优化管理服务。