JavaScript实现的JSP日期选择器
![](https://csdnimg.cn/release/wenkucmsfe/public/img/star.98a08eaa.png)
"一个基于JavaScript的日历控件,用于JSP页面中,提供日期选择功能。此控件由梅花雨开发,后来经过walkingpoison的多次优化,可以在IE5.0及以上版本的浏览器中使用。控件允许用户通过点击按钮或输入框聚焦触发日历显示,具有年月下拉框,支持ESC键关闭,可自定义是否拖动,并且有较好的视觉效果。" 在JSP页面中,为了提高用户体验,有时会使用时间选择器来帮助用户方便地选择日期。这里提到的是一款用纯JavaScript实现的时间选择器,它以日历的形式展示,适用于微软的Internet Explorer 5.0及更高版本。这个控件的核心在于其JavaScript代码,它不仅实现了基本的日历显示,还包含了多个增强功能。 首先,控件提供了两种调用方式。一种是在输入框中添加一个按钮,当用户点击按钮时,通过`setday(this, document.all.txt)`函数将日历弹出,并将选定的日期填入指定的输入框。另一种是直接在输入框上设置`onfocus`事件,当用户点击输入框时自动显示日历,如`<input onfocus="setday(this)">`。 控件的设计考虑了用户交互性,比如用户可以通过点击年份和月份来选择具体的年和月,而且按下ESC键可以关闭日历。此外,它还有响应式设计,当用户在控件外部点击时,也会自动关闭日历。 walkingpoison对原版进行了多次优化,主要改动包括: 1. 使用iframe作为日历的承载元素,解决了日历可能被其他元素(如SELECT或FLASH)遮挡的问题。 2. 修复了焦点丢失时关闭日历的逻辑,使得在失去焦点时能正确关闭控件。 3. 更新了按键处理,允许使用Tab键切换焦点时关闭日历。 4. 添加了自定义是否可拖动日历的功能,提升了用户操作的灵活性。 5. 修复了年/月选择后的显示问题和数字转换错误。 6. 对控件的外观进行了美化,提高了视觉吸引力,并调整了下拉框的位置,增加了点击空间。 需要注意的是,由于使用了iframe,如果将日历拖动到窗口之外,日历的移动可能会受到影响。 这个JavaScript日历控件是一个实用的工具,它为JSP页面提供了一种简洁而高效的方式,让用户能够方便地选取日期,同时保持了良好的兼容性和用户体验。开发者可以根据自己的需求进一步定制和优化。
![](https://csdnimg.cn/release/download_crawler_static/3068540/bg3.jpg)
剩余11页未读,继续阅读
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://profile-avatar.csdnimg.cn/1035b519464d4c1a9a995c0cab06fe2a_lengfengkong.jpg!1)
- 粉丝: 5
- 资源: 11
我的内容管理 收起
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助
![](https://csdnimg.cn/release/wenkucmsfe/public/img/voice.245cc511.png)
会员权益专享
最新资源
- 京瓷TASKalfa系列维修手册:安全与操作指南
- 小波变换在视频压缩中的应用
- Microsoft OfficeXP详解:WordXP、ExcelXP和PowerPointXP
- 雀巢在线媒介投放策划:门户网站与广告效果分析
- 用友NC-V56供应链功能升级详解(84页)
- 计算机病毒与防御策略探索
- 企业网NAT技术实践:2022年部署互联网出口策略
- 软件测试面试必备:概念、原则与常见问题解析
- 2022年Windows IIS服务器内外网配置详解与Serv-U FTP服务器安装
- 中国联通:企业级ICT转型与创新实践
- C#图形图像编程深入解析:GDI+与多媒体应用
- Xilinx AXI Interconnect v2.1用户指南
- DIY编程电缆全攻略:接口类型与自制指南
- 电脑维护与硬盘数据恢复指南
- 计算机网络技术专业剖析:人才培养与改革
- 量化多因子指数增强策略:微观视角的实证分析
![](https://img-home.csdnimg.cn/images/20220527035711.png)
![](https://img-home.csdnimg.cn/images/20220527035111.png)
![](https://csdnimg.cn/release/wenkucmsfe/public/img/green-success.6a4acb44.png)