bootstrap datetimepicker学习

文章参考 http://blog.csdn.net/feng1603/article/details/41869523 http://blog.csdn.net/tszxlzc/article/details/50774375 http://www.malot.fr/bootstrap-datetimepicker/  

$('#startStudyDate111').datetimepicker({
format: 'yyyy/mm',
weekStart: 1,
autoclose: true,
startView: 4,
minView: 4,
forceParse: false,
todayBtn:  1,
language: 'zh-CN'
});

 



 

$('#endStudyDate222').datetimepicker({
Format: 'yyyy-mm',
weekStart: 1,
autoclose: true,
startView: 3,
minView: 3,
forceParse: false,
todayBtn:1,
language: 'zh-CN'
});

 

$('#endStudyDate555').datetimepicker({
autoclose: true,
startView: 0,
minView: 0,
forceParse: false,
minuteStep : 5,
todayBtn:1,
language: 'zh-CN'
});

 

$('#endStudyDate666').datetimepicker({
autoclose: true,
startView: 1,
minView: 0,
forceParse: false,
minuteStep : 2,
todayBtn:1,
language: 'zh-CN'
});

 

$('#endStudyDate333').datetimepicker({
Format: 'yyyy-mm-dd',
weekStart: 1,
autoclose: true,
startView: 2,
minView: 2,
forceParse: false,
todayBtn:1,
language: 'zh-CN'
});

 
 
 

<div class="add_edu_item margin_top_20">
<div class="width_100px float_left text-right padding_right_15">
时间<span class="color_e5005a">*</span>
</div>
<div class="margin_left_100">
<input type="text" id="startStudyDate111" data-date-format="yyyy-mm">
<span>到</span>
<input type="text" id="endStudyDate222" data-date-format="yyyy-mm">
</div>
</div>

 
备注：

data-date-format="yyyy-mm"  表示选中日期之后显示的格式。

 

startView 

Number, String. 默认值：2, ‘month’

 

日期时间选择器打开之后首先显示的视图。 可接受的值：

 

0 or ‘hour’ for the hour view 

1 or ‘day’ for the day view 

2 or ‘month’ for month view (the default) 

3 or ‘year’ for the 12-month overview 

4 or ‘decade’ for the 10-year overview. Useful for date-of-birth datetimepickers. 

minView 

Number, String. 默认值：0, ‘hour’

 

日期时间选择器所能够提供的最精确的时间选择视图。

 

 

minuteStep 

Number. 默认值: 5

 

此数值被当做步进值用于构建小时视图。对于每个 minuteStep 都会生成一组预设时间（分钟）用于选择。





大小: 8.9 KB




大小: 6.2 KB




大小: 6.9 KB




大小: 9.7 KB




大小: 12.4 KB
查看图片附件