账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    layui日历组件,点击清空按钮,让日期插件选中的值清空
    36
    0

    问题描述

    写了两个日历组件用于前后对应,控制时间区间,后不能比前小之类的。现在我先选择后一个时间,点击清空,然后再次打开,选择第一个时间,发现第二个时间还是影响着第一个时间的选择。此时便想有什么方法能将选中的值清空掉

    问题出现的环境背景及自己尝试过哪些方法

    写了两个input日历,相互对应传值给后台,现在设置时间区间,就是后面不能比前面小之类的,然后点击清空下次再点不会被上一次设的时间影响,现在是不设else,就会被影响,设置了,开始那边清空了结束不影响,不过结束那边清空,开始这边直接全部无法选择

    相关代码

    // 请把代码文本粘贴到下方(请勿用图片代替代码)

    var startTime = laydate.render({ //开始的日历
        elem: '#startDate',
        done: function (value, date) { //回调
            if (value !== '') { //设置开始日历的值为结束日历可选的最小值
                endTime.config.min = {
                    year: date.year,
                    month: date.month - 1,
                    date: date.date
                }
            } else {
                endTime.config.min = {
                    year: 1900,
                    month: 0, //关键
                    date: 1
                }
            }
        }
    
    });
    var endTime = laydate.render({ //结束的日历
        elem: '#endDate',
        done: function (value, date) { //回调
            if (value !== '') { //设置结束日历的值为开始日历可选的最大值
                startTime.config.max = {
                    year: date.year,
                    month: date.month - 1,
                    date: date.date
                }
            } else {
                startTime.config.max =  {
                    year: 1900-2099,
                    month: 0, //关键
                    date: 1
                }
            }
        }
    });
    

    你期待的结果是什么?实际看到的错误信息又是什么?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 乌龟快饿死了 普通会员 1楼

      在layui日历组件中,你可以通过以下代码实现点击清空按钮时,让日期插件选中的值清空:

      javascript laydate('.date input[type="date"]').on('click', function(){ laydate('.date input[type="date"]').val(''); });

      在这个代码中,我们首先在日期插件的输入框上添加了一个点击事件监听器。当用户点击这个日期插件的输入框时,这个事件监听器就会被触发。

      然后,我们使用laydate('.date input[type="date"]').val('');来清空这个日期插件的输入框中的值。这个方法会清空输入框中的所有文本。

      请注意,你需要将laydate('.date input[type="date"]').val('');中的.date input[type="date"]替换为你实际的日期插件的输入框的CSS选择器。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部