Bootstrap3 之 Datetimepicker

官网地址：http://eonasdan.github.io/bootstrap-datetimepicker/

git地址：https://github.com/Eonasdan/bootstrap-datetimepicker

moment语言包：https://github.com/moment/moment

datetimepicker使用配置说明：http://eonasdan.github.io/bootstrap-datetimepicker/Options/

moment时间格式化使用说明：http://momentjs.com/docs/

使用方法，需要引用的文件：

<script src="../Js/jquery-1.11.3.min.js"></script>
<link href="../Js/bootstrap-3.3.5-dist/css/bootstrap.css" rel="stylesheet" />
<script src="../Js/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>

<link href="../Js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<script src="../Js/bootstrap-datetimepicker/js/moment-with-locales.min.js"></script>
<script src="../Js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>

配置：

<input id="dateTime" class="form-control" type="text" value="选择时间" placeholder="选择时间" onchange="chooseDate()">

$('#dateTime').datetimepicker({

    locale: 'zh-cn',

    format: 'YYYY-MM',

    useCurrent: false

}).on('dp.hide',chooseDate);  // dp.hide可根据实际需要加以修改

如果想要选择时间段，怎么办呢，我们继续：

var start = $('#startTime').datetimepicker({

    locale: 'zh-cn',

    format: 'YYYY-MM',

    useCurrent: false

});

var end = $('#endTime').datetimepicker({

    locale: 'zh-cn',

    format: 'YYYY-MM',

    useCurrent: false

});

start.on('dp.hide', function(e){

    end.data("DateTimePicker").minDate(e.date);

});

end.on('dp.hide', function(e){

    start.data("DateTimePicker").maxDate(e.date);

});