Jquery EasyUi日期输入框(点击今天不自动填充)

查询百度多天无果,大脑灵光一现,可以给日期输入框下面的今天按钮添加点击事件,手动赋值给日期输入框,这样可以实现点击今天自动填充日期

当存在多个日期输入框,点击之后的赋值就会成为问题,官方文档中也没有什么好的事件可以解决,下面是官方给出的日期输入框事件,只有一个,就很离谱。

突然看到方法是扩展自combo(自定义下拉框),哪事件是不是也是扩展自combo(自定义下拉框)(也不知道为什么文档中没有写)。下面是combo(自定义下拉框)的事件,下拉面板显示的时候触发(这个事件刚好可以配合点击事件来完成日期输入框分辨功能)。下面来实现

 问题展示:点击今天没有反应,日期不自动填充(点击今天没有反应,日期不自动填充。自己傻傻的以为是bug,实际上是点击今天只是跳转到日期上来,翻到其他月份点击今天就会跳转到当前月份选中今天,如下图一样今天是20211203)

 第一步

         声明全局变量

var dateBox;

第二步

         给需要点击今天自动填充的日期输入框添加onShowPanel事件(当下拉面板显示的时候触发)

下代码为前端页面

			<div style="margin-bottom: 15px;">
				<label for="startTime">计划下达起止日期</label>
				<input id="startTime" name="startTime" class="easyui-datebox" editable="false" style="height:22px;width: 152px;">
				<span style="display: inline-block;"></span>
				<label for="endTime">----</label>
				<input id="endTime" name="endTime" class="easyui-datebox"  editable="false" style="height:22px;width: 152px;">
			</div>

下代码为前端js 

            $("#endTime").datebox({
                onShowPanel: function () {
                    dateBox = $("#endTime")
                }
            })
            $("#startTime").datebox({
                onShowPanel: function () {
                    dateBox = $("#startTime")
                }
            })

第三步

        给日期输入框今天按钮添加点击事件

        所用事件如下图(第一张事件来自combo事件,第二张事件来自datebox事件)

            $(".datebox-current").click(function (param) {
                var date=_this.formatTime();
                dateBox.datebox("setValue",date);
                dateBox.datebox("hidePanel");
            });

第四步

        上效果图

        点击今天

        完成自动填充,也不影响其他日期输入框

如觉得有用,请点个赞,谢谢支持

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

@轮胎

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值