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





阅读更多
个人分类: js
上一篇微信小程序canvas渐变,实现彩虹效果。
下一篇微信自定义组件-组件与页面的通信 页面和组件相互传数据
想对作者说点什么? 我来说一句

Kalendae 多功能日历插件

2018年05月11日 36KB 下载

js日历控件日期多选Kalendajs

2014年03月07日 84KB 下载

js日历控件(可多选日期)

2013年11月03日 17KB 下载

Kalendae日历控件+layer弹框

2016年04月14日 81KB 下载

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

关闭
关闭
关闭