多格式、功能强大的移动端日期选择插件

简介: rolldate是一款多格式、功能强大的移动端日期选择插件。该插件可以在移动端实现iOS样式的日期时间选择效果。支持多种时间格式,使用better-scroll作为滑动插件,支持自定义语言和回调函数等,功能非常强大。

tx000225.png

在线预览

下载

rolldate是一款多格式、功能强大的移动端日期选择插件。该插件可以在移动端实现iOS样式的日期时间选择效果。支持多种时间格式,使用better-scroll作为滑动插件,支持自定义语言和回调函数等,功能非常强大。

使用方法

在页面中引入下面的文件。

<script src="./js/rolldate.min.js"</script>

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 使用/、-、空格、:之一分隔,可随意组合


beginYear

2000
日期开始年份


endYear

2100
日期结束年份


value


日期初始化的默认值,列如'2018-03-18'


lang

年、月、日...
配置插件语言,默认:title:'选择日期',cancel:'取消',confirm:'确认',
year:'年',month:'月',day:'日',hour:'时',min:'分',sec:'秒'


minStep

1
分钟按指定数分隔


init

null
插件触发前的回调函数,return false可阻止插件执行


moveEnd

null
插件滚动后的回调函数,函数返回一个参数(better-scroll实例)


confirm

null
确认按钮触发前的回调函数,return false可阻止插件执行,
return其他值可修改日期,函数返回一个参数(选中的日期)


cancel

null
插件取消时触发的回调函数


trigger

'tap'
默认使用tap解决移动端click事件300ms延迟,可选click替换tap。注意使用tap会阻止其他绑定的click事件的触发


show


主动触发插件,当trigger为tap时,主动触发插件应该使用此方法


hide


主动隐藏插件


相关文章
|
6月前
|
移动开发
Uniapp 多功能富文本编辑组件 可多端使用 H5插入
Uniapp 多功能富文本编辑组件 可多端使用 H5插入
154 0
|
小程序 前端开发 安全
uniapp中解析markdown支持网页和小程序
对于`markdown`相信大家都不陌生,日常写文档或日常记录都用到的比较多,书写的是`markdown`的格式,实时预览的是转换后的`html`样式。本次实现的需求是在`uniapp`中转换`markdown`文本展示在不同的平台,主要平台是浏览器使用和微信小程序使用。
262 1
|
1月前
|
存储 移动开发 小程序
uniapp富文本editor输入二次扩展兼容微信小程序
uniapp富文本editor输入二次扩展兼容微信小程序
72 0
|
设计模式 JSON 数据格式
Joomla网站开发如何配置交互式 Lottie 动画?
Joomla网站开发如何配置交互式 Lottie 动画?这个应用是很常见的,而且很多人喜欢在网站上用动画的效果创造更直观的体现。那么Joomla网站开发如何配置交互式 Lottie 动画?下面北京六翼信息技术有限公司技术开发工程师给大家讲一下这个问题。
Joomla网站开发如何配置交互式 Lottie 动画?
|
自然语言处理 JavaScript 前端开发
动态滑动图片验证码组件(支持多语言,移动端)
动态滑动图片验证码组件(支持多语言,移动端)
动态滑动图片验证码组件(支持多语言,移动端)
|
移动开发 前端开发 JavaScript
移动端H5通用表单验证插件
将表单验证的通用部分提炼出来,做成一个简易插件,方便调用。 已将源码放到GitHub上,名字叫zValidate。
移动端H5通用表单验证插件
|
JavaScript
|
Web App开发 JavaScript 前端开发
下一篇
无影云桌面