Django组件 | 时间选择组件

CSS

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css" rel="stylesheet">

HTML

<input type="text" id="dt" class="form-control" placeholder="日期">

JS

<script>
    $(function(){
     $("#dt").datepicker({
      format: 'yyyy-mm-dd',
      // startDate:'0',
      language:"zh-CN",
      autoclose:true   
    })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/locales/bootstrap-datepicker.zh-CN.min.js"></script>

加个图标

<div class='form-group'>
    <label>日期</label>
    <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
    <input class="form-control" type="text" autocomplete="off" id="dt" name="date">
</div>