下面编程教程网小编给大家介绍一下关于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)
基础教程推荐
猜你喜欢
- jquery ajax实现文件上传功能实例代码 2023-02-15
- 网页简历结构和语义信息 hResume微格式 2024-04-01
- vscode封装HTML代码片段 2023-10-29
- 非常实用的ajax用户注册模块 2023-01-20
- 改变checkbox默认选中状态及取值的实现代码 2024-01-06
- vuejs配置文件中出现的^与~代表什么意思 2024-12-08
- TS中最常见的声明合并(接口合并) 2023-08-08
- springmvc 发送ajax出现中文乱码的解决方法汇总 2022-12-15
- vuejs导出功能封装table 2024-12-09
- CSS filter:hue-rotate色调旋转滤镜实现按钮批量生产 2024-04-04