Calendar Demo

一、选择单天的时间段选择(TA的日期选择器):

开始时间:2013-04-14
结束时间:2013-04-14
最近七天


示例代码:(更多参数,参见用户手册)

<script type="text/javascript">
var dateRange = new pickerDateRange('date', {
isTodayValid : true,
startDate : '2013-04-14',
endDate : '2013-04-21',
theme : 'ta',
defaultText : ' 至 ',
success : function(obj) {
//设置回调句柄
}
});
</script>

二、支持点击结束日期自动提交,无须确定按钮(ta,gri主题均支持):

开始时间:2012-06-14
结束时间:2012-07-10


示例代码:(更多参数,参见用户手册)

<script type="text/javascript">
var dateRange = new pickerDateRange('date', {
isTodayValid : true,
startDate : '2012-06-14',
endDate : '2012-07-10',
autoSubmit : true,
theme : 'ta',
defaultText : ' 至 ',
success : function(obj) {
//设置回调句柄
}
});
</script>

三、月份选择器:

开始时间:2012-06-14
结束时间:2012-07-10

示例代码:需额外引入日期的js和css

<script type="text/javascript">
monthPicker.create('month_picker', {
trigger : 'month_trigger',
autoCommit : true,
callback : function(obj){
$("#monthContainer").html('开始时间 : ' + obj.startDate + '
结束时间 : ' + obj.endDate);
}
});
</script>

四、时间段对比选择:

开始时间:2012-06-12
结束时间:2012-07-10


示例代码:(更多参数,参见用户手册)

<script type="text/javascript">
var dateRange = new pickerDateRange('date', {
isTodayValid : true,
startDate : '2012-06-12',
endDate : '2012-07-10',
needCompare : false,
defaultText : ' 至 ',
success : function(obj) {
//设置回调句柄
}
});
</script>

五、单天对比选择:

开始时间:2012-06-11
结束时间:2012-07-15


示例代码:(更多参数,参见用户手册)

<script type="text/javascript">
var dateRange = new pickerDateRange('date', {
isTodayValid : true,
startDate : '2012-06-11',
startCompareDate : '2012-07-10',
needCompare : true,
singleCompare : true,
defaultText : ' 对比 ',
success : function(obj) {
//设置回调句柄
}
});
</script>

适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。

来源:Gxl网-jquery插件