2.2.8 • Published 5 years ago
zane-calendar v2.2.8
zane-data-time-calendar
Time calendar plug-in
Explain:
1.The plug-in does not depend on any third party plug-in. So you can use it anywhere. 2.Plugins are not compatible with a low version of the IE browser. So please use your IE browser carefully.
images
Document :http://www.seosiwei.com/zjkf/166.html
Demo address : http://www.seosiwei.com/zaneDate/index.html
How to use
Browser usage
<link href="./dist/zane-calendar.min.css">
<script src="./dist/zane-calendar.min.js"></script>
<!-- Input boxes for plug-ins requiring extra time. -->
<input type="" name="" id="zane-calendar">
Initialization
zaneDate({
elem:'#zane-calendar',
})
Webpack usage
const zaneDate = require('zane-calendar') or
import zaneDate from 'zane-calendar'
<!-- Input boxes for plug-ins requiring extra time. -->
<input type="" name="" id="zane-calendar">
Initialization
zaneDate({
elem:'#zane-calendar',
})
How do I run the project?
git clone https://github.com/wangweianger/zane-data-time-calendar.git
npm install
npm run dev
npm run build
Parameter description.
{
elem:'#zane-calendar', 控件的dom原生 注意:仅限制于id选择器
type:'day', 可选类型 day year month time doubleday doubleyear doublemonth doubletime
lang:'cn', 可选择语言类型 cn , en
width:280, 插件宽度配置 250 <= X <= 500
height:300, 插件高度配置 250 <= X <= 350
behindTop:10, 插件于输入框的高度
format:'yyyy-MM-dd HH:mm:ss', 时间格式化
begintime:'', 开始时间 (但选择器默认选择此项)
endtime:'', 结束时间 (double选择器需要)
min:'', 可选取时间最小范围 1900-10-01
max: '', 可选取时间最大范围 2099-12-31
position:'fixed', 定位方式 暂时只支持 fixed
event:'click', 事件方式 暂时只支持 click
zindex:100, z-index值
showtime:true, 是否显示选择时间
showclean:true, 是否显示清除按钮
shownow:true, 是否显示当前按钮
showsubmit:true, 是否显示提交按钮
haveBotBtns:true, 是否有底部按钮列表
showsecond:true, type='time|doubletime'时是否支持选择秒单位
calendarName:'', 此参数勿动 表示当前时间插件实例化对象
mounted:()=>{}, 插件加载完成之后调用
change:(fullday,begintime,endtime)=>{}, 时间变更之后调用
done:(fullday,begintime,endtime)=>{}, 选择完成之后调用
}
Examples
默认完整选项
zaneDate({
elem:'#zane-calendar',
})
只选择年月日
zaneDate({
elem:'#zane-calendar',
showtime:false,
})
使用英文
zaneDate({
elem:'#zane-calendar',
lang:'en',
})
只选择年
zaneDate({
elem:'#zane-calendar',
type:'year',
})
只选择月
zaneDate({
elem:'#zane-calendar',
type:'month',
})
只选择时间
zaneDate({
elem:'#zane-calendar',
type:'time',
})
格式化方式
zaneDate({
elem:'#zane-calendar',
format:'yyyy年MM月dd日 HH时mm分ss秒',
})
限定能选择的最小最大区间
zaneDate({
elem:'#zane-calendar',
min:'2017-08-01',
max:'2017-08-20',
})
回调
zaneDate({
elem:'#zane-calendar',
change:function(fulltime,begintime,endtime){
alert('fulltime:'+fulltime+'\r\nbegintime:'+begintime+'\r\nendtime:'+endtime)
}
})
回调
zaneDate({
elem:'#zane-calendar',
done:function(fulltime,begintime,endtime){
alert('fulltime:'+fulltime+'\r\nbegintime:'+begintime+'\r\nendtime:'+endtime)
}
})
......
具体的请查看demo
1.1.0 版本新增 double选择器
config.type 新增double类型 可选类型如下:day year month time doubleday doubleyear doublemonth doubletime
双日期范围选择
zaneDate({
elem:'#demo21',
type:'doubleday'
})
双年范围选择
zaneDate({
elem:'#demo22',
type:'doubleyear',
})
双月范围选择
zaneDate({
elem:'#demo23',
type:'doublemonth',
})
双时间选择
zaneDate({
elem:'#demo24',
type:'doubletime',
})
1.2.0 版本
1.doubleday类型新增选择时间,支持时分秒选择
2.double类型检测距离右边window边线的距离,若不足,自动排列为上下两个日期
config.type doubleday支持选择时间范围
双日期范围选择
zaneDate({
elem:'#demo25',
format:'yyyy-MM-dd HH:mm:ss',
type:'doubleday',
showtime:true
})
1.2.1 版本 新增z-index 参数
zaneDate({
elem:'#zane-calendar',
zindex:500,
})
1.2.2 版本 完善日历插件文档
2.1.1 版本 修复单页面BUG,修复safair苹果信息 相关BUG
2.2.0 版本 修复上一月下一月跳月问题
2.2.3 版本 修复点击多次重复生成日历问题
2.2.4 版本 增加结束时间大于开始时间的判断
2.2.5 版本 增加双选择器区间选中样式效果
2.2.6 版本 修复双选择器默认选中颜色相关bug
2.2.7 版本 type='time|doubletime'时是否支持选择秒单位
2.2.8
5 years ago
2.2.7
5 years ago
2.2.6
5 years ago
2.2.4
5 years ago
2.2.3
6 years ago
2.2.2
6 years ago
2.2.1
6 years ago
2.2.0
6 years ago
2.1.8
6 years ago
2.1.7
6 years ago
2.1.6
6 years ago
2.1.5
6 years ago
2.1.4
6 years ago
2.1.3
6 years ago
2.1.2
6 years ago
2.1.1
6 years ago
2.1.0
6 years ago
2.0.9
6 years ago
2.0.8
6 years ago
2.0.7
6 years ago
2.0.6
7 years ago
2.0.5
7 years ago
2.0.4
7 years ago
2.0.3
7 years ago
2.0.2
7 years ago
2.0.1
7 years ago
1.3.2
7 years ago
1.3.1
7 years ago
1.3.0
7 years ago
1.2.6
7 years ago
1.2.5
7 years ago
1.2.3
7 years ago
1.2.2
7 years ago
1.2.1
7 years ago