Bootstrap-datepicker也是一款非常好用的選擇日期插件,Github上的star已有9994個star,作者還針對不同的語言封裝了日期語言包,非常方便使用,傳送門:uxsolutions/bootstrap-datepicker。
使用說明,看官方文檔,需要使用css預處理語言less將build/build_standalone.less編譯為datepicker.css,然后再頁面引入jquery.js、bootstrap-datepicker.js、因為我們一般使用簡體中文,所以還需要引入bootstrap-datepicker.zh-CN.js(該文件位於 js/locales 下)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="./datepicker.css">
<script src="./js/jquery-3.2.1.js"></script>
<script src="./js/bootstrap-datepicker.js"></script>
<script src="./js/locales/bootstrap-datepicker.zh-CN.js"></script>
</head>
<body>
<div class="input-group date" data-provide="datepicker">
選擇日期:<input type="text" id="datepicker" class="form-control">
<div class="input-group-addon">
<span class="glyphicon glyphicon-th"></span>
</div>
</div>
<script>
$('#datepicker').parent().datepicker({
"autoclose":true,"format":"yyyy-mm-dd","language":"zh-CN"
});
</script>
</body>
</html>
