layer时间插件laydate

1. 引入JS。官网：http://laydate.layui.com

2. 根据需要做相应的配置。详情参看官网。

<script>

laydate({

elem: '#seldate', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'

event: 'focus', //响应事件。如果没有传入event，则按照默认的click

format: 'YYYY/MM/DD hh:mm:ss', // 分隔符可以任意定义，该例子表示只显示年月

festival: true, //显示节日

istime: true, //显示时间选项

choose: function(datas){ //选择日期完毕的回调

alert('得到：'+datas);

}

});

</script>

laydate.render({
elem: '#test1' //指定元素
});

elem - 绑定元素 elem: '#test'

type - 控件选择类型类型：String，默认值：date

range - 开启左右面板范围选择类型：Boolean/String，默认值：false

format - 自定义格式类型：String，默认值：yyyy-MM-dd

value - 初始值类型：String，默认值：new Date()

isInitValue - 初始值填充 isInitValue: false //是否允许填充初始值，默认为 true

min/max - 最小/大范围内的日期时间值类型：string，默认值：min: '1900-1-1'、max: '2099-12-31'

trigger - 自定义弹出控件的事件类型：String，默认值：focus，如果绑定的元素非输入框，则默认事件为：click

show - 默认显示类型：Boolean，默认值：false

position - 定位方式类型：String，默认值：absolute

zIndex - 层叠顺序类型：Number，默认值：66666666

showBottom - 是否显示底部栏类型：Boolean，默认值：true

btns - 工具按钮类型：Array，默认值：['clear', 'now', 'confirm']

lang - 语言类型：String，默认值：cn cn（中文版）、en（国际版，即英文版）

theme - 主题类型：String，默认值：default default（默认简约）、molv（墨绿背景）、#颜色值（自定义颜色背景）、grid（格子主题）

calendar - 是否显示公历节日类型：Boolean，默认值：false

mark - 标注重要日子类型：Object，默认值：无

控件初始打开的回调 ready: function(date){}

日期时间被切换后的回调 change: function(value, date, endDate){}

控件选择完毕后的回调 done: function(value, date, endDate){}

layer时间插件laydate相关推荐

Layui时间插件laydate只选择时分
一.说明二.分析三.效果四.代码一.说明需要一个只选择时分的控件,首先想到的是laydate,然后看一下控件的类型 type 可选值名称用途 year 年选择器只提供年列表选择 mon ...
html日期英文状态显示不出来,html 时间控件插件laydate，显示时分，不显示秒
概述项目中使用到了时间控件,不知为何input-->date无法弹出控件,故使用了js插件laydate.根据项目需求,时间要求精度为分,故隐藏秒控件. 参考网友博客,最终实现如下. 代码 l ...
laydate日期时间插件实现不用点击确定
使用laydate时间插件,想要改变插件原本的内容,这让人很头疼,可是需求提出来了我们能说什么....本次就是在不改变插件源码的基础上,改变插件样式. <div> <ul clas ...
laydate日期时间插件年选择器和年月选择器实现不用点击确定
laydate日期时间插件只有是日期的时候才不用点确定,年选择器和年月选择器的时候必须点确定才能选中.用起来很不方便,这里在不改变源代码的情况实现不用点击确定. 1.年选择器实现 <input ...
时间与日期插件 -- laydate 使用方法(摘自官网)
简单例子: $(function(){ var start = { elem: '#start', //选择ID为START的input format: 'YYYY/MM/DD hh:mm:ss', ...
laydate在火狐，360极速模式下，多个时间插件，只有一个可以用问题
laydate在火狐,360极速模式下,多个时间插件,只有一个可以用问题 <input id=" startTime" onClick="laydate({elem ...
日期时间选择插件 - laydate.js
日期时间选择插件 laydate.js 1. 引入JS. 官网:http://laydate.layui.com <script type="text/javascript" ...
关于导入My97DatePicker时间插件遇到的问题及解决方案
开始时单独导入到jsp的空白页面,时间的函数可以发挥作用,代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional ...
工作笔记---js时间插件的使用
工作中用到日期时间插件,需要精确到秒,总结工作所得,标记... 第一种,jquery-datapicker(默认是年月日),加上扩展jquery-ui-timepicker-addon.js(可以实现 ...
动态判断时间插件显示到年月日时分秒
根据得到的时间格式,动态判断时间插件显示到年月日时分秒主要split切割字符串来判断 split将一个字符串切割为字符串数组 <!DOCTYPE html> <html>&l ...

layer时间插件laydate

layer时间插件laydate相关推荐

最新文章

热门文章