您好,登錄后才能下訂單哦!
先看一下 層級聯動的案例
先選擇前面時間后 后面的時間不要超過前面的時間
先選擇后面的時間后,前面的時間不要少于后面的時間
下面看封裝代碼
function initDateTimePicker(startTime, endTime, timeFormat, minview) { $(startTime).datetimepicker("remove"); $(startTime).datetimepicker({ language: sessionStorage.getItem("lang"), autoclose: true, todayHighlight: true, endDate: new Date(), format: timeFormat, startView: minview, minView: minview, }).on("changeDate", function() { var value = $(startTime).val(); $(endTime).datetimepicker("remove"); $(endTime).datetimepicker({ language: sessionStorage.getItem("lang"), autoclose: true, todayHighlight: true, endDate: new Date(), startDate: value, format: timeFormat, startView: minview, minView: minview, }) }); $(endTime).datetimepicker("remove"); $(endTime).datetimepicker({ language: sessionStorage.getItem("lang"), autoclose: true, todayHighlight: true, endDate: new Date(), format: timeFormat, startView: minview, minView: minview, }).on("changeDate", function() { var value = $(endTime).val(); $(startTime).datetimepicker("remove"); $(startTime).datetimepicker({ language: sessionStorage.getItem("lang"), autoclose: true, todayHighlight: true, endDate: value, format: timeFormat, startView: minview, minView: minview, }) }); }
初始化datetimepicker及起止時間雙向聯動公共方法 startTime:起始時間輸入框id號,例如:'#archiveStartTime'
endTime:結束時間輸入框id號,例如:'#archiveEndTime' timeFormat
:時間格式,例如:'yyyy-mm-dd',
minview:最先顯示時間 或者層級
總結
以上所述是小編給大家介紹的Bootstrap Datetimepicker 聯動,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。