bootstrap，datetimepicker日期時(shí)間選擇器-限制時(shí)間段，以及中文顯示問(wèn)題

Zhuxy 發(fā)布于2019-08-02 16:09 / 2875人閱讀

摘要：日期時(shí)間選擇器所能夠提供的最精確的時(shí)間選擇視圖。當(dāng)選擇器關(guān)閉的時(shí)候，是否強(qiáng)制解析輸入框中的值。結(jié)束時(shí)間顯示箭頭顯示中文包問(wèn)題語(yǔ)言包

基于bootstrap的css，js
bootstrap-datetimepicker的css，js

  
  
  
 
  


  
 
// 開(kāi)始時(shí)間：  
$("#qBeginTime").datetimepicker({  
    todayBtn: true,
    autoclose : true,
    bootcssVer:3, // 顯示箭頭
    format: "yyyy-mm",
    startView: 3, // 日期時(shí)間選擇器打開(kāi)之后首先顯示的視圖。
    minView: 3, // 日期時(shí)間選擇器所能夠提供的最精確的時(shí)間選擇視圖。
    forceParse: false, // 當(dāng)選擇器關(guān)閉的時(shí)候，是否強(qiáng)制解析輸入框中的值。
    language: "zh-CN"
}).on("changeDate",function(e){  
    var startDate = $("#startDate").val();
    $("#returnDate").datetimepicker("setStartDate",startDate);
    $("#startDate").datetimepicker("hide");
});  
// 結(jié)束時(shí)間：  
$("#qEndTime").datetimepicker({  
    todayBtn: true,
    autoclose : true,
    bootcssVer:3, // 顯示箭頭
    format: "yyyy-mm",
    weekStart: 1,
    startView: 3,
    minView: 3,
    forceParse: false,
    language: "zh-CN"  
}).on("changeDate",function(e){  
    var returnDate = $("#returnDate").val();
    $("#startDate").datetimepicker("setReturnDate",returnDate);
    $("#returnDate").datetimepicker("hide");
});

顯示中文包問(wèn)題
moment語(yǔ)言包：https://github.com/moment/moment

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/54751.html

相關(guān)文章

bootstrap，datetimepicker日期時(shí)間選擇器-限制時(shí)間段，以及中文顯示問(wèn)題

摘要：日期時(shí)間選擇器所能夠提供的最精確的時(shí)間選擇視圖。當(dāng)選擇器關(guān)閉的時(shí)候，是否強(qiáng)制解析輸入框中的值。結(jié)束時(shí)間顯示箭頭顯示中文包問(wèn)題語(yǔ)言包基于bootstrap的css，jsbootstrap-datetimepicker的css，js // 開(kāi)始時(shí)間： $(#qBeginTime).datetimepicker({ todayBt...

kycool 2019-08-30 15:43 評(píng)論0 收藏0
用Vue搭建一個(gè)應(yīng)用盒子（二）：datetime-picker

摘要：接著上次的進(jìn)度，我們已經(jīng)實(shí)現(xiàn)了一個(gè)。我們應(yīng)該完成的效果是一個(gè)，日期選擇器。好了，到這一步，還不能實(shí)現(xiàn)這個(gè)插件。我們還需要添加一個(gè)方法，因?yàn)椴](méi)有被執(zhí)行，所以我們需要添加如下代碼好了，這里事件選擇插件就能順利使用了。與的結(jié)合使用實(shí)例接著上次的進(jìn)度，我們已經(jīng)實(shí)現(xiàn)了一個(gè)todo-list。它已經(jīng)具備了基本的功能，可以新建、編輯、刪除任務(wù)。但是美中不足的是，它的時(shí)間設(shè)定上只能通過(guò)輸入一段字符...

Ververica 2019-08-26 11:32 評(píng)論0 收藏0
移動(dòng)端material風(fēng)格日期時(shí)間選擇器

摘要：好多時(shí)候在移動(dòng)端需要一個(gè)的日期選擇器，由于在應(yīng)用上有可能應(yīng)用各種框架庫(kù)等所以說(shuō)一個(gè)無(wú)依賴的，這樣易于上層進(jìn)行封裝。主要包含兩種選擇器日期和時(shí)間。好多時(shí)候在移動(dòng)端需要一個(gè)的日期選擇器，由于在應(yīng)用上有可能應(yīng)用各種框架庫(kù)（Vue.js, React.js, zepto.js等）；所以說(shuō)一個(gè)無(wú)依賴的，這樣易于上層進(jìn)行封裝。直接開(kāi)門(mén)見(jiàn)山，先來(lái)張動(dòng)圖看看效果： showImg(https://s...

philadelphia 2019-08-22 10:41 評(píng)論0 收藏0
bootstrap插件 datetimepicker開(kāi)始月份設(shè)置bug

摘要：但是反過(guò)來(lái)，開(kāi)始日期輸入框中的可選結(jié)束月份卻沒(méi)有問(wèn)題。初步判斷是在設(shè)置開(kāi)始月份的語(yǔ)句上有問(wèn)題?？戳艘幌略创a，找到了原因，是行的代碼應(yīng)該是減，而不是加代碼行修改為修改后顯示正常 datetimepicker插件下載地址代碼如下： //日期輸入框 $(input).datetimepicker({ format: yyyy-mm, //日期格式為年-月 startV...

zorro 2019-08-19 17:30 評(píng)論0 收藏0
bootstrap datetimepicker日期插件美化

摘要：需求日期面板默認(rèn)展開(kāi)可以根據(jù)點(diǎn)擊的日期，處理額外的信息，如在這天記錄一些信息等大部分的日期插件日期面板是隱藏的，點(diǎn)擊的時(shí)候日期面板顯示，基于的日期插件如果是在元素上實(shí)例化插件的情況，面板是顯示的，在上面板則是隱藏的。需求：（1）日期面板默認(rèn)展開(kāi) （2）可以根據(jù)點(diǎn)擊的日期，處理額外的信息，如在這天記錄一些信息等大部分的日期插件日期面板是隱藏的，點(diǎn)擊input的時(shí)候日期面板顯示，基于...

ninefive 2019-08-29 17:00 評(píng)論0 收藏0