layDate时间组件的运用（附下载layDate-v5.3.1）

下面web建站小编给大家介绍一下关于layDate时间组件的运用方法（附下载layDate-v5.3.1）。

1、下载layDate-v5.3.1，引入laydate.js

下载layDate-v5.3.1：点击下载

2、input组件：

复制代码<input type="text" id="test1">
1

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'
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

进入官网入口

laydate在指定日期新增注释（点击日期显示提示语）

el-date-picker时间选择器默认时间为前7天（15天）

el-time-select赋值失败解决方法（从接口获取值赋值不上去）

修改element-ui源码兼容el-date-picker支持年区间选择

element-ui时间组件el-date-picker用x清空后报错解决方法

标签： laydate, 时间组件

上面是“layDate时间组件的运用（附下载layDate-v5.3.1）”的全面内容，想了解更多关于 前端知识 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_2462.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！