Bootstrap风格的日期和时间控件

今天在做项目的过程中，使用了两个比较好看的日期选择和时间选择控件，记录下来。这两个控件样式都是基于Bootstrap的。

日期控件bootstrap-datepicker

http://www.eyecon.ro/bootstrap-datepicker/

日选择模式

$("#datetimepicker").datepicker({
  todayBtn : "linked",
  keyboardNavigation : false,
  forceParse : false,
  calendarWeeks : true,
  format: "yyyy年M月d日",
  autoclose : true
});

月选择模式

<div class="input-group date" id="datetimepicker" data-date-format="yyyy年m月">
  <input type="text" name="yearMonth" id="yearMonth" class="form-control" readonly="true"/>
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
    </span>
</div>

$("#datetimepicker").datepicker({
  todayBtn : "linked",
  keyboardNavigation : false,
  forceParse : false,
  calendarWeeks : true,
  format: "yyyy年M月",
  minViewMode: 1,
  autoclose : true
});

 时间控件clockpicker

http://www.jq22.com/yanshi417

http://weareoutman.github.io/clockpicker/

<div class="input-group clockpicker">
    <input type="text" name="endTime" id="endTime" class="form-control" readonly="true">
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-time"></span>
    </span>
</div>

$(".clockpicker").clockpicker({
  autoclose: true            	
});