Kalendae使用总结
2019-03-06 16:50:18
git官方教程:https://github.com/Twipped/Kalendae
js、css:https://pan.baidu.com/s/1Ye-d09OMG_31E8NLqzGwDA 提取码:4v58
项目中需要用到能够显示多个日期的组件,查了好久,找到了Kalendae,当然其他的日期组件因为不了解,不代表不能实现。
使用方式:(日历绑定div)
1.html中引入js、css
2.<div id="datepk"></div>
3.js中初始化并设置参数:
var kal= new Kalendae(document.getElementById("datepk"), {
months:1,
mode:'multiple',
subscribe: {
'date-clicked': function (date) {
//点击日期事件
},
'change': function(date){
//日期更改事件
},
'view-changed': function(date){
//界面更改事件
}
}
});
注意,这里使用一个变量接收,可以在后期通过这个变量对日历进行动态操作,例如获取所有选中的日期:kal.getSelected();
遇到的bug:
项目中需要动态显示跨好几个月的日期,当把这些日期动态的设置给日历时,出现了一种现象:
不是当前月份的日期也被选中了,苦恼了很久也没有从Kalendae根本上找到解决方式,最后我在view-changed添加了事件,每次变化都只查询当前年月的日期然后显示。
Kalendae使用总结的更多相关文章
- 基于JS功能强大的日期插件Kalendae
开发中需要一个日期插件,可以在zepto下使用,可以选择日期段,可以设置不可选日期 找到一个完全满足的,并且基于JS不依赖于任何库. 在线演示:http://chipersoft.com/Kalend ...
- 一款灵活好用的日历控件Kalendae
Kalendae是一款纯js不依赖任何js库的日历控件,可以轻松实现显示月份数量,当前选中多个日期,并可以按照周等你想要的格式去定制选中项. 下载地址:GitHub/Kalendae 第一步:Kale ...
- 日期插件kalendae,遇到的一些问题
1.日期中文显示 /*_months : 'January_February_March_April_May_June_July_August_September_October_November_D ...
- 日期多选插件Kalendae.js
在项目中要实现日期多选的功能,于是在网上找到Kalendae.js,此文主要记录本人对于Kalendae.js的一些用法,以便以后查阅,希望对读者也有所帮助 主要内容如下: Kalendaejs一句话 ...
- JavaScript日期选择控件Kalendae
在线演示 本地下载
- 9款精致HTML5/jQuery日历时钟控件源码下载(源码请见百度云) 链接:http://pan.baidu.com/s/1geIXe75 密码:7m4a
现在的网页应用越来越丰富,我们在网页中填写日期和时间已经再也不用手动输入了,而是使用各种各样的日期时间选择控件,大部分样式华丽的日期选择和日历控件都是基于jQuery和HTML5的,比如今天要分享的这 ...
- WEB 前端开发插件整理
下拉框插件 1.select http://select2.github.io/ 2.双 select http://loudev.com 3.selectbox http://aui.github. ...
- WebDriver高级应用实例(2)
2.1在日期选择器上进行日期选择 被测网页的网址: https://www.html5tricks.com/demo/Kalendae/index.html Java语言版本的API实例代码 impo ...
- javascript开源大全
javascript开源大全 Ajax框架-jQuery 可视化HTML编辑器-CKEditor 国产jQuery-UI框架-(jUI)-DWZ 网页开发FireFox插件-Firebug 服务器端的 ...
随机推荐
- Python学习笔记: 闭包
闭包的基本定义 在计算机科学中,闭包(英语:Closure),又称词法闭包(Lexical Closure)或函数闭包(function closures),是引用了自由变量的函数.这个被引用的自由变 ...
- LeetCode(268) Missing Number
题目 Given an array containing n distinct numbers taken from 0, 1, 2, -, n, find the one that is missi ...
- spring+struts2+hibernate框架依赖pom.xml
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...
- poj--1064
题意:有N条绳子,它们的长度分别为Li.如果从它们中切割出K条长度相同的绳子的话,这K条绳子最长能有多长?答案保留到小数点后2位. 思路:这些最大最小化问题大多数可以用二分查找的方法来解题 用 d 表 ...
- Linux网络文件系统NFS详解
什么是文件系统,NFS文件系统又是什么? 简单的说,文件系统就是通过软件对磁盘上的数据进行组织和管理的一种机制,对其的一种封装或透视. 你女朋友拍了美美的暧昧照片,放一个文件夹里发送给了A服务器,当你 ...
- vagrant中的precise64使用静态的能和host所在局域网的其他机器互相通信
vagrant中的precise64使用静态的能和host所在局域网的其他机器互相通信
- 转:模式窗口showModalDialog的用法总结
模式窗口showModalDialog的用法总结 最近几天一直在处理模式窗口的问题,索性写了这篇总结,以供参考: 1.打开窗口:var handle = window.showModalDialo ...
- Selenium WebDriver- 操作浏览器的cookie
#encoding=utf-8 import unittest import time from selenium import webdriver from selenium.webdriver i ...
- python装饰器实现用户密码认证(简单初形)
import timecurrent_user={'user':None}def auth(engine = 'file'): def deco(func): #func=最初始的index和最初始的 ...
- Timer和TimerTask详解
1.概览 Timer是一种定时器工具,用来在一个后台线程计划执行指定任务.它可以计划执行一个任务一次或反复多次.TimerTask一个抽象类,它的子类代表一个可以被Timer计划的任务. 简单的一个例 ...