bootstrap datepicker的基本使用教程
首先
引入相應(yīng)css和js:
<link rel="stylesheet" th:href="@{/assets/css/datepicker.css}" rel="external nofollow" />
<script th:src="@{/assets/js/date-time/bootstrap-datepicker.js}"></script>
然后html代碼裝載控件
<div class="input-group">
<input class="form-control date-picker" id="endTime" data-date-end-date="0m"
type="text" placeholder="選擇年月"/>
<span class="input-group-addon">
<i class="fa fa-calendar bigger-110"></i>
</span>
</div>
初始化控件:
$('#endTime').datepicker({
format: 'yyyy-mm',
startView: 1, maxViewMode: 1,minViewMode:1,
autoclose :true
})
現(xiàn)在可以看效果了:

選擇日期后觸發(fā)事件:
$('#endTime').datepicker({
format: 'yyyy-mm',
startView: 1, maxViewMode: 1,minViewMode:1,
autoclose :true
}).on("changeMonth", function(e) {
var date_=e.date;
var year_str = date_.getFullYear();
var month_str = date_.getMonth()+1;
if(month_str<10){
month_str="0"+month_str;
}
var endMonth=year_str+"-"+month_str;
getLitDirection(endMonth);
getLitSaleTop(endMonth);
getLitViewTop(endMonth);
getLitErrorRecovery(endMonth);
var month_value=year_str+"年"+(date_.getMonth()+1)+"月";
$("#end_Time").html(month_value);
$("#split1").show();
$("#split2").show();
}).next().on(ace.click_event, function(){
$(this).prev().focus();
});
總結(jié)
以上所述是小編給大家介紹的bootstrap datepicker的基本使用教程 ,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
如果你覺得本文對(duì)你有幫助,歡迎轉(zhuǎn)載,煩請(qǐng)注明出處,謝謝!
- JS控件bootstrap datepicker使用方法詳解
- BootStrap Datepicker 插件修改為默認(rèn)中文的實(shí)現(xiàn)方法
- 淺談Bootstrap的DatePicker日期范圍選擇
- bootstrap datepicker限定可選時(shí)間范圍實(shí)現(xiàn)方法
- bootstrap datepicker 與bootstrapValidator同時(shí)使用時(shí)選擇日期后無法正常觸發(fā)校驗(yàn)的解決思路
- BootStrap中Datepicker控件帶中文的js文件
- BootStrap的Datepicker控件使用心得分享
- bootstrap 日期控件 datepicker被彈出框dialog覆蓋的解決辦法
相關(guān)文章
uniapp uni-swipe-action 滑動(dòng)操作狀態(tài)恢復(fù)功能實(shí)現(xiàn)
按照uni-app官方文檔的寫法,當(dāng)前一條滑動(dòng)確認(rèn)之后頁面列表刷新但是滑動(dòng)的狀態(tài)還在,我們需要在滑動(dòng)確認(rèn)之后 頁面刷新 滑動(dòng)狀態(tài)恢復(fù),下面小編給大家分享uniapp uni-swipe-action 滑動(dòng)操作狀態(tài)恢復(fù)功能實(shí)現(xiàn),感興趣的朋友跟隨小編一起看看吧2024-06-06
在for循環(huán)中l(wèi)ength值是否需要緩存
這篇文章主要介紹了在for循環(huán)中l(wèi)ength值是否需要緩存,需要的朋友可以參考下2015-07-07
基于javascript數(shù)組實(shí)現(xiàn)圖片輪播
這篇文章主要為大家詳細(xì)介紹了基于javascript數(shù)組實(shí)現(xiàn)圖片輪播的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-05-05
如何用threejs實(shí)現(xiàn)實(shí)時(shí)多邊形折射
這篇文章主要介紹了如何用threejs實(shí)現(xiàn)實(shí)時(shí)多邊形折射,對(duì)three.js庫(kù)感興趣的同學(xué),可以參考下2021-05-05
javascript實(shí)現(xiàn)數(shù)組去重的多種方法
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)數(shù)組去重的多種方法,感興趣的小伙伴們可以參考一下2016-03-03

