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

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

突然看到方法是扩展自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");});

第四步

上效果图

点击今天

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

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

Jquery EasyUi日期输入框（点击今天不自动填充）相关推荐

Easyui之DateBox日期输入框
DateBox初步介绍前言案例演示 1.静态html实现 2.js动态加载数据实现总结前言今天为大家分享的知识点是DateBox组件,博主自主学习之后决定分享给你们啦,感兴趣的小伙伴们搬好小 ...
第二百一十三节，jQuery EasyUI，NumberBox(数值输入框)组件
jQuery EasyUI,NumberBox(数值输入框)组件功能:只能输入数值,和各种数值的计算学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表本节课重点了解 EasyUI ...
jQuery EasyUI/TopJUI基本的数字输入框（保留两位小数，带前缀后缀...）
jQuery EasyUI/TopJUI基本的数字输入框(保留两位小数,带前缀后缀...) numberbox(数值输入框) HTML required:必填字段,默认为false:prompt:显示 ...
jquery+easyui开发、培训文档
目录 1.... Accordion(可折叠标签)......................................................................... ...
jquery easyui中文培训文档
目录 1.... Accordion(可折叠标签)......................................................................... ...
jquery easyui 操作总结
2019独角兽企业重金招聘Python工程师标准>>> src:http://lhdst-163-com.iteye.com/blog/1707232 1.dialog Java代码 ...
第二百一十七节，jQuery EasyUI，NumberSpinner(数字微调)组件
jQuery EasyUI,NumberSpinner(数字微调)组件学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表本节课重点了解 EasyUI 中 NumberSpinner ...
html获取文本框中的文字,JavaScript实现input输入框点击获取文字内容
Js实现INPUT输入框,当鼠标点击文字时自动获取文字内容,并显示在文本框中,一个惯用的表单技巧,有时可省去一些用户输入的麻烦,可有效提升用户体验. input输入框获取js点击文字内容 .c{ wi ...
easyUI 日期控件修改...
前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. 个人觉得easyUI挺好用的. 它的中文文档地址: http://www.zi-han.net/ca ...
jquery easyUI第一篇【介绍、入门、使用常用的组件】
tags: web前端库什么是easyUI 我们可以看官方对easyUI的介绍: easyUI就是一个在Jquery的基础上封装了一些组件....我们在编写页面的时候,就可以直接使用这些组件...非 ...

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

第一步

第二步

第三步

第四步

Jquery EasyUi日期输入框（点击今天不自动填充）相关推荐

最新文章

热门文章