bootstrap框架日期时间 开始日期和结束日期选择

页面表单查询时,常要求要查询一个日期时间段内的数据,若采用bootstrap框架的datetimepicker插件来控制,需要了解怎么个用法:

bootstrap框架日期时间 开始日期和结束日期选择

引入js文件

1 jQuery.min.js
2 bootstrap.min.js
3 bootstrap-datetimepicker.min.js

html代码

1 <input class="input-medium search-query" name="createDatetime_start" value="${createDatetime_start}" type="text" class="form-control"   data-date-format="yyyy-mm-dd hh:ii:ss" readonly/>
2 ~ <input class="input-medium search-query" name="createDatetime_end" value="${createDatetime_end}" type="text" class="form-control"   data-date-format="yyyy-mm-dd hh:ii:ss" readonly/>

jQuery代码

 1 $(\'#datetimepicker_start\').datetimepicker({
 2     weekStart: 1,
 3     todayBtn:  1,
 4     autoclose: 1,
 5     todayHighlight: 1,
 6     minView:0,
 7     forceParse: 1,
 8     showMeridian: 0
 9   });
10         
11  $(\'#datetimepicker_end\').datetimepicker({
12     weekStart : 1,
13     todayBtn : 1,
14     autoclose : 1,
15     todayHighlight : 1,
16     minView : 0,
17     forceParse : 1,
18     showMeridian : 0
19  });
20 
21  function getLocalTime(nS) { //转换时间戳为格式 yyyy-mm-dd hh:ss:ii
22      return new Date((parseInt(nS) + 60 * 60 * 4) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/[\u4e00-\u9fa5]/g, "");
23  };
24  $("#datetimepicker_start").on("changeDate",
25      function(e) {
26           $(\'#datetimepicker_end\').datetimepicker(\'setStartDate\',
27                     getLocalTime(e.date.valueOf() / 1000));
28           });
29  $("#datetimepicker_end").on("changeDate",
30      function(e) {
31            $(\'#datetimepicker_start\').datetimepicker(\'setEndDate\',
32                     getLocalTime(e.date.valueOf() / 1000));
33            });

以上只是在使用过程中的处理,有不妥之处,望留言,共同讨论,O(∩_∩)O谢谢...