3.1.3 • Published 4 years ago

rolldate v3.1.3

Weekly downloads
16
License
MIT
Repository
github
Last release
4 years ago

rolldate npm npm

此插件为jquery-date的全新版本,主要为了解决旧版参数设计不够合理、滑动效率不高、依赖jquery、没有可选的主题风格等问题,并增加了回调函数,使插件有更大的灵活性。

2019/05/24 3.0版本更新

上一个版本为2.1.5, 新版本(从3.0.0开始)的改动:

  1. 使用方式由new rolldate.Date改为new Rolldate;
  2. 回调函数调整:tapBefore更名为init,confirmBefore更名为confirm,取消confirmEnd,增加cancel;
  3. 日期格式(format)调整为无限制,可根据规则随意组合;

2019/02/03重要版本更新

上一个版本为1.5.1, 新版本(从2.0.0开始)与此前版本的不同之处:

  1. 将滑动插件由iscroll替换为better-scroll,提升了兼容性;
  2. 改变了界面风格,操作更加方便;
  3. 取消了rolldate.css文件,只需引入js即可;
  4. 移除了主题风格、日期初始化的滑动时间设置;

注意2.0.0之前的版本将不再维护,如有需要请访问:旧版rolldate

演示

rolldate(下方直接扫码即可体验)

rolldate

使用方式

es6

import Rolldate from 'rolldate'
new Rolldate({
  el:'#date'
})

commonJS

var Rolldate = require('rolldate');
new Rolldate({
  el:'#date'
})

amd

require(['rolldate'],function(Rolldate){
  new Rolldate({
    el:'#date'
  })
})

cmd

seajs.use('rolldate',function(undefined){
    //插件没有遵循cmd规范,这里的Rolldate是全局的
    new Rolldate({
      el:'#date'
    })
});

参数、方法说明

名称必填默认值说明
el绑定插件的dom元素,插件内部使用document.querySelector,也可以直接传递dom元素对象,只支持单个
format'YYYY-MM-DD'日期格式,无限制。规则:年-YYYY 月-MM 日-DD 时-hh 分-mm 秒-ss 使用/、-、空格、:之一分隔,可随意组合
beginYear2000日期开始年份
endYear2100日期结束年份
value日期初始化的默认值,列如'2018-03-18'
lang年、月、日...配置插件语言,默认:title:'选择日期',cancel:'取消',confirm:'确认',year:'年',month:'月',day:'日',hour:'时',min:'分',sec:'秒'
minStep1分钟按指定数分隔
initnull插件触发前的回调函数,return false可阻止插件执行
moveEndnull插件滚动后的回调函数,函数返回一个参数(better-scroll实例)
confirmnull确认按钮触发前的回调函数,return false可阻止插件执行,return其他值可修改日期,函数返回一个参数(选中的日期)
cancelnull插件取消时触发的回调函数
trigger'tap'默认使用tap解决移动端click事件300ms延迟,可选click替换tap。注意使用tap会阻止其他绑定的click事件的触发
show主动触发插件,当trigger为tap时,主动触发插件应该使用此方法
hide主动隐藏插件
//完整参数、方法示例
var rd = new Rolldate({
    el: '#date',
    format: 'YYYY-MM-DD',
    beginYear: 2000,
    endYear: 2100,
    minStep:1,
    lang:{title:'自定义标题'},
    trigger:'tap',
    init: function() {
      console.log('插件开始触发');
    },
    moveEnd: function(scroll) {
      console.log('滚动结束');
    },
    confirm: function(date) {
      console.log('确定按钮触发');
    },
    cancel: function() {
      console.log('插件运行取消');
    }
})
rd.show();
rd.hide();
3.1.3

4 years ago

3.1.2

5 years ago

3.1.1

5 years ago

3.1.0

5 years ago

3.0.0

5 years ago

2.1.5

5 years ago

2.1.4

5 years ago

2.1.3

5 years ago

2.1.2

5 years ago

2.1.1

5 years ago

2.1.0

5 years ago

2.0.0

5 years ago

1.5.1

5 years ago

1.5.0

5 years ago

1.4.9

6 years ago

1.4.8

6 years ago

1.4.7

6 years ago

1.4.6

6 years ago

1.4.5

6 years ago

1.4.4

6 years ago

1.3.4

6 years ago

1.3.3

6 years ago

1.3.2

6 years ago

1.3.1

6 years ago

1.3.0

6 years ago

1.2.0

6 years ago

1.1.9

6 years ago

1.1.8

6 years ago

1.1.7

6 years ago

1.1.6

6 years ago

1.1.5

6 years ago

1.0.5

6 years ago

1.0.4

6 years ago

1.0.3

6 years ago

1.0.2

6 years ago

1.0.1

6 years ago

1.0.0

6 years ago

0.0.1

6 years ago