javascript 日历提醒系统( 兼容所有浏览器 )

JavaScript日历提醒系统是一种基于纯JavaScript和CSS构建的轻量级插件，旨在提供跨浏览器的日历功能，并具有提醒功能。这个系统不依赖任何外部库，因此可以保证代码的简洁性和执行效率。以下是对该系统关键特性的详细说明： 1. **基本日历功能**： 这个日历系统提供了基本的日历展示，用户可以通过它查看当前月份及之前的月份，进行日期选择。 2. **日历提醒**： 系统允许从数据库或其他数据源获取提醒信息。通过传递一个包含日期和对应提醒内容的数组，可以设置特定日期的提醒。例如： ```javascript new Calendar("id").show({ "20091120": "今天干了嘛嘛。。。", "2009320": "今天干了嘛嘛。。。" }); ``` 在这些日期上，当鼠标悬停时，会自动显示相应的提醒内容。 3. **不同类型的提示样式**： 提醒样式根据日期与当前日期的关系分为三类：当日、当年当月当日和当月当日。每种样式都有独特的视觉效果，以区分不同的提醒状态。 4. **使用方式**： - **show() 方法**：适用于已有DOM元素，如div。将该元素的id作为参数传递给`Calendar`实例，例如：`var cr = Calendar("div1"); cr.show();` - **pop() 方法**：针对`<input type='text'>`元素，创建弹出式日历。如：`var cr = Calendar("input2"); cr.pop();` 5. **语言支持**： 日历系统支持多种语言，通过设置`language`参数可以选择语言。默认为1（英语），0代表中文。 6. **年份范围**： 用户可以自定义日历显示的年份范围，通过`startYear`和`endYear`参数设定，默认显示当前年份的前五年至后一年。 7. **容器管理**： 系统内部维护了两个主要容器：`popContainer_id`用于弹出式日历，`caleContainer_id`用于嵌入式日历。这使得日历可以适应不同的使用场景。 8. **交互设计**： 鼠标覆盖在具有提醒的日期上时，会自动显示提示内容，增加了用户体验。 9. **源码与演示**： 提供的压缩包中包含了详细的使用方法和示例代码，同时给出了在线演示地址，便于开发者了解和测试功能。 10. **自定义扩展**： 开发者可以根据需要扩展这个基础系统，比如添加更多样式的提示、改进日期选择机制，或者与其他JavaScript库集成以实现更复杂的功能。 这个JavaScript日历提醒系统以其简洁的代码结构、良好的浏览器兼容性和灵活性，为开发人员提供了一种高效、实用的解决方案，可用于网站或应用中的日期管理和提醒功能。