下面编程教程网小编给大家介绍一下关于layDate时间组件的运用方法(附下载layDate-v5.3.1)。
1、下载layDate-v5.3.1,引入laydate.js
下载layDate-v5.3.1:点击下载
2、input组件:
<input type="text" id="test1">
3、调用方法:
//初始赋值
laydate.render({
elem: '#test1'
,value: '1989-10-14'
});
//选中后的回调
laydate.render({
elem: '#test2'
,done: function(value, date){
alert('你选择的日期是:' + value + '\n获得的对象是' + JSON.stringify(date));
}
});
//日期切换的回调
laydate.render({
elem: '#test3'
,change: function(value, date){
alert('你选择的日期是:' + value + '\n\n获得的对象是' + JSON.stringify(date));
}
});
//不出现底部栏
laydate.render({
elem: '#test4'
,showBottom: false
});
//只出现确定按钮
laydate.render({
elem: '#test5'
,btns: ['confirm']
});
//自定义事件
laydate.render({
elem: '#test6'
,trigger: 'mousedown'
});
//点我触发
laydate.render({
elem: '#test7'
,eventElem: '#test7-1'
,trigger: 'click'
});
//双击我触发
lay('#test8-1').on('dblclick', function(){
laydate.render({
elem: '#test8'
,show: true
,closeStop: '#test8-1'
});
});
//日期只读
laydate.render({
elem: '#test9'
,trigger: 'click'
});
//非input元素
laydate.render({
elem: '#test10'
});
以上是编程学习网小编为您介绍的“layDate时间组件的运用(附下载layDate-v5.3.1)”的全面内容,想了解更多关于 前端知识 内容,请继续关注编程基础学习网。
编程基础网
本文标题为:layDate时间组件的运用(附下载layDate-v5.3.1)
基础教程推荐
猜你喜欢
- vuejs实现多条文字无缝上下滚动 2024-12-08
- uniapp打包成微信小程序的详细过程 2022-08-31
- AJAX和JSP混合使用方法实例 2022-12-18
- VUE跨域代理配置 2023-10-08
- JS判断浏览器类型与版本的实现代码 2023-11-30
- JavaScript点击按钮后弹出透明浮动层的方法 2024-01-08
- 鼠标悬停图片产生边框的效果实现 2023-12-19
- Html5 之 Canvas 2023-10-26
- CSS3常见动画的实现方式 2024-01-08
- JS判断浏览器是否安装flash插件的简单方法 2023-12-14
