datetime 插件

1  写一段文本

<div id="nomarl-wrap">    <div class="form-group">        <label class="col-xs-2 help-block"><span class="red">*</span>设定巡检时间</label>        <div class="col-xs-9">            <div class="input-daterange input-group" id="datepicker">                <input type="text" class="form-control form_datetime" name="begin_time" value="<?php echo date('Y/m/d H:00') ?>" autocomplete="off" readonly />                <span class="input-group-addon">to</span>                <input type="text" class="form-control form_datetime" name="end_time" value="<?php echo date('Y/m/d H:00',time()+86400) ?>" autocomplete="off" readonly />            </div>        </div>    </div></div>

<div class="form-group">    <label class="col-xs-2 help-block"><span class="red">*</span>设定巡检时间</label>    <div class="col-xs-9">        <div class="input-daterange input-group">            <input type="text" class="form-control time-picker" name="begin_hour_time" value="22:00" autocomplete="off" readonly />            <span class="input-group-addon">to</span>            <input type="text" class="form-control time-picker" name="end_hour_time" value="23:00" autocomplete="off" readonly />        </div>    </div></div>

2 js 文件  （通过id ，class 关联）

$(".form_datetime").datetimepicker({    format: 'yyyy/mm/dd hh:ii',    todayHighlight: true,    keyboardNavigation: false,    forceParse: false,    autoclose: true});

$(".time-picker").hunterTimePicker();   //只选择小时、分的时间插件jquery-timepicker.js   会有弹出窗

3 引入文件头：

{{ stylesheet_link('css/plugins/datapicker/bootstrap-datetimepicker.min.css') }}

{{ stylesheet_link('css/plugins/datapicker/datepicker3.css') }}{{ stylesheet_link('css/plugins/datapicker/timePicker.css') }}

尾：

{{ javascript_include('js/plugins/datapicker/bootstrap-datetimepicker.min.js')}}

{{ javascript_include('js/plugins/datapicker/bootstrap-datepicker.js')}}

{{ javascript_include('js/plugins/datapicker/jquery-timepicker.js')}}

https://www.cnblogs.com/fanyx/p/6647642.html

http://www.w3school.com.cn/tags/att_input_autocomplete.asp