Kalendae多选日历插件

近期需要做日期选择,各种百度都没有满足要求的插件,(要求多选,多月份,可随意禁用日期,可默认选择等等。。。)直到在灯火阑珊处遇见它--Kalendae!

代码下载  github-Kalendae

终于等到你~

首先,引入两个必要文件咯 

<link rel="stylesheet" type="text/css" href="kalendae.css" />

<script type="text/javascript" src="kalendae.standalone.js"></script>

然后你的html 来个input~

<input type="text" id="schedule_date"  value="" />

接下来就是js啦

<script type="text/javascript">
//日历插件
function calendarTool(inputName, disableTime = [], selectedTime = []) {
new Kalendae.Input(inputName, {
direction: 'any', //past过去   today-past过去(包括当天)  future未来   today-future未来(包括当天)   any任何  
directionScrolling: true, //指定 direction设定的进行展示,其他不展示
months: 3, //展示几个月
mode: 'multiple', //模式 single 单选, multiple 多选, range 范围选择
blackout: function(date) { //指定日期不能选择
for(var i = 0; i < disableTime.length; i++) {
if(Kalendae.moment(date).format("YYYY-MM-DD") == disableTime[i]) {
return true
};
}
},
selected: selectedTime //默认选择日期
});
};
var disableTime = ['2018-05-22', '2018-05-18', '2018-05-19'];
                var selectedTime = ['2018-05-21','2018-05-25'];

calendarTool('schedule_date',disableTime,selectedTime)

</script>


Bingo!!!

代码下载  github-Kalendae





阅读更多
想对作者说点什么?
相关热词

博主推荐

换一批

没有更多推荐了,返回首页