bootstrap-datepicker是bootstrap中一款好用的時間插件,支持中文,支持時間段的選擇,支持時間格式配置,在線示例中用法提供友好。
點擊頁面上的配置,右下角的代碼同步更新。
1.下載bootstrap-datepicker中放在bootstrap文件夾。
在頁面進行css引用
<link rel="stylesheet" href="bootstrap-datepicker-1.9.0-dist/css/bootstrap-datepicker.min.css">
在頁面進行js引用,放在jquery和bootstrap的js后面
<script src="bootstrap-datepicker-1.9.0-dist/js/bootstrap-datepicker.min.js"></script>
<script src="bootstrap-datepicker-1.9.0-dist/locales/bootstrap-datepicker.zh-CN.min.js"></script>
2.在頁面添加input元素
<div id="sandbox-container">
<input type="text" class="form-control">
</div>
3.在頁面添加js代碼
$('#sandbox-container input').datepicker({
language: "zh-CN",//配置中文
autoclose: true,//自動關閉
format: "yyyy-mm-dd"//日期顯示格式
});
最終效果