bootstrap就非常好用，而且框架布局很漂亮，用起來(lái)也很簡(jiǎn)單。今天小編給大家分享BootStrap的Datepicker控件使用心得，一起看看吧
2013年Bootstrap火了，2014年Bootstrap將繼續(xù)受到更多人的喜歡，它不僅擁有一套完整漂亮的UI，而且愛(ài)好者們?yōu)槠溟_(kāi)發(fā)擴(kuò)展了很多有用的插件和主題！讓其擁有無(wú)限可能！
公司喜歡使用各種開(kāi)源免費(fèi)的框架，bootstrap就非常好用，而且框架布局很漂亮，用起來(lái)也很簡(jiǎn)單。今天遇到要使用它的datepicker這個(gè)控件。
問(wèn)題是：兩個(gè)時(shí)間點(diǎn)，分為開(kāi)始時(shí)間和結(jié)束時(shí)間，結(jié)束時(shí)間必須在開(kāi)始時(shí)間之后。于是一頓研究，從上午研究到3點(diǎn)才解決問(wèn)題。
總結(jié)了一下問(wèn)題所在。主要原因是項(xiàng)目里用的jquery，也用了jquery ui,碰巧它里面也有一個(gè)datepicker，名字一模一樣。一直折騰啊，在查jquery的datepicker用法，在網(wǎng)上找了各種說(shuō)是好使的，就是對(duì)datepicker綁定onSelect方法。恰巧的是，很多網(wǎng)友都說(shuō)onSelect不起作用....
突然靈光一現(xiàn)，發(fā)現(xiàn)lib文件夾下一堆bootstrap的東西，更重要的是還有一個(gè)文件夾上寫(xiě)著bootstrap_datepicker巴拉巴拉的，才醒悟，我們用的不是jquery下的datepicker?！雪n⊙b汗
直接貼代碼：
js代碼：
$('#starttime').datepicker({
format: 'yyyy.mm.dd',
weekStart: 1,
autoclose: true,
todayBtn: 'linked',
language: 'zh-CN'
}).on('changeDate',function(ev){
var startTime = ev.date.valueOf();
if(start<teach){
alert("“評(píng)估開(kāi)始時(shí)間 ”不能早于“授課時(shí)間 ” ！");
$("#starttime").focus();
}
});
$('#endtime').datepicker({
format: 'yyyy.mm.dd',
weekStart: 1,
autoclose: true,
todayBtn: 'linked',
language: 'zh-CN'
}).on('changeDate',function(ev){
var endTime = ev.date.valueOf();
end = endTime;
if(end<start){
alert("“評(píng)估結(jié)束時(shí)間 ”不能早于“評(píng)估開(kāi)始時(shí)間 ” ！");
}else{
}
});
jsp代碼：
<div id="starttime_main">
<label for="starttime">開(kāi)始時(shí)間：</label>
<div data-date="2013.05.10" id="starttimeDiv">
<input type="text" value="" id="starttime" readonly>
<span>
<i></i>
</span>
</div>
</div>
<div id="endtime_main">
<label for="endtime">結(jié)束時(shí)間：</label>
<div
data-date="2013.05.10" id="endtimeDiv">
<input type="text" value="" id="endtime"
readonly> <span><i
class="icon-calendar"></i> </span>
</div>
</div>
以上所述是小編給大家介紹的BootStrap的Datepicker控件使用心得分享，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。