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)文章
layui表格內(nèi)放置圖片,并點(diǎn)擊放大的實(shí)例
今天小編就為大家分享一篇layui表格內(nèi)放置圖片,并點(diǎn)擊放大的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09
理解JavaScript中的Proxy 與 Reflection API
這篇文章主要介紹了JavaScript中的Proxy 與 Reflection API的相關(guān)資料,幫助大家更好的理解和學(xué)習(xí)JavaScript,感興趣的朋友可以了解下2020-09-09
javascript實(shí)現(xiàn)可全選、反選及刪除表格的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)可全選、反選及刪除表格的方法,實(shí)例展示了javascript針對(duì)表格全選、反選、刪除、隔行變色、刪除提示等常用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-05-05
利用JavaScript編寫Python內(nèi)置函數(shù)查詢工具
Python有豐富的內(nèi)置函數(shù)實(shí)現(xiàn)各種功能,但查詢內(nèi)置函數(shù)時(shí)總是需要百度查,有沒有一個(gè)小工具可以單機(jī)無網(wǎng)絡(luò)查詢Python內(nèi)置函數(shù),方便自己學(xué)習(xí)編寫Python程序呢?本文就來用JavaScript編寫一個(gè)2023-02-02
原生js實(shí)現(xiàn)表格循環(huán)滾動(dòng)
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)表格循環(huán)滾動(dòng),每次滾動(dòng)一行停頓,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-11-11
Bootstrap每天必學(xué)之按鈕(Button)插件
Bootstrap每天必學(xué)之按鈕(Button)插件,通過按鈕(Button)插件,您可以添加進(jìn)一些交互,比如控制按鈕狀態(tài),或者為其他組件(如工具欄)創(chuàng)建按鈕組,感興趣的小伙伴們可以參考一下2016-04-04

