刚学Prototype框架，想自己写个日历控件来练习一下Prototype，整理了一下思路后,初步实现了一些代码。希望大家给点意见。
（运行要引进Prototype 1.5.1.2.js）
<script type="text/javascript" src="Prototype 1.5.1.2.js"></script>
<body>
<table id="date" cellpadding="0" cellspacing="0" border="1px">
<tr id="week">
<td>星期日</td>
<td>星期一</td>
<td>星期二</td>
<td>星期三</td>
<td>星期四</td>
<td>星期五</td>
<td>星期六</td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
</table>
<script type="text/javascript">
/**
返回每个月的最大天数
*/
function getMonthDay(month){
if(month == 0)month=12;
if(month == 13)month=1;
var year = new Date();
var $31 = [1,3,5,7,8,10,12];//３１天的月份
if(month == 2){// 闰年｜平年的２月份处理（印象中初中数学书上好象是这样的，也不知道对错）
if(year.getYear()%4 == 0){
return 29;
}
return 28;
}
for(var i=0;i<$31.length;i++){
if(month == $31[i]){
return 31;
}
}
return 30;
}
var week = $("week");//标题行
var weekDate = new Date();
var week_day = week.down(weekDate.getDay());//今天星期几
week_day.setStyle({backgroundColor:"#33FFFF"});//把对应的星期背景渲染
var this_monthDay = getMonthDay(weekDate.getMonth()+1);//当前月份的天数。
/*计算每月的一号是星期几,
想在网上这个公式，但找到的都是长篇大论，看了心烦。
所以自己找了一下规律，写了个公式，测试了一下感觉还挺准的，
有希望有更好建议的人不要吝啬，能提供一下比较可靠的实现。
*/
var first_Day = weekDate.getDay() + (Math.abs(weekDate.getDate() % 7 - 7) + 1);//计算每月的一号是星期几
if(first_Day > 7)first_Day = first_Day - 7;
if(first_Day == 7)first_Day = 0;
var n = 1;
come_Back:
while((week = week.next()) != undefined){
for(var j = 0;j < 7;j ++){
if(n == 1 && j < first_Day){
}else if(n == 1 && j == first_Day){
week.down(j).update(n+"号");
n ++;
}else{
if(n == weekDate.getDate()){
week.down(j).setStyle({backgroundColor:"#33FFFF"});//渲染当天的背景
}
week.down(j).update(n+"号");
n ++;
}
if(n > this_monthDay)
break come_Back;//大于每月的最大天数，就直接返回
}
}
</script>
</body>
分享到：
相关推荐
1. **初始化日历插件**：在需要显示日历的输入框上添加`onclick`事件，调用`WdatePicker()`函数，如： ```html ()" /> ``` 2. **参数设置**：`WdatePicker`函数可以接收一个配置对象，用于自定义日历的行为和...
这里包括了一个输入框用于用户输入日期和一个用于显示日历的容器。接着，还展示了通过CSS对日历的初步样式设计，这样可以让日历在浏览器中展示出一个初步的视觉效果。 文章接着介绍了蔡勒公式以及如何利用这个公式...
10. **时间日期处理**：动态显示当前时间、倒计时、日历选择器等，对于需要时间相关功能的网站很有用。 总之，"网页特效库2008.exe"是一个宝贵的资源，它收集了当年流行的网页特效，对于学习和复用这些经典特效，...
JavaScript可以在前端进行初步的日期验证和显示，但实际的农历提醒功能需要在服务器端实现，因为服务器可以定期检查并发送提醒。 服务器端的实现可能涉及以下几点： 1. 数据获取：从数据库中检索所有开启农历提醒的...
第1章 CSS的初步体验 1.1 CSS的概念 1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的文字效果 ...
第1章 CSS的初步体验 1.1 CSS的概念 1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的文字效果 ...
第1章 CSS的初步体验 1.1 CSS的概念 1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的...
8. **测试与优化**：完成初步实现后，需要在多种浏览器和设备上进行测试，确保在不同环境下都能正常工作。根据反馈进行性能优化，提高用户体验。 总结来说，创建一个JavaScript日期控件需要结合HTML、CSS和...
它为访问者提供了对整个网站的初步印象，因此设计和内容的布局至关重要。开发者会在此基础上添加JavaScript和CSS来实现动态效果和样式。 2. **blog-page-single-carousel.html**：这是一个博客文章详情页面，其中...
第1章 CSS的初步体验 1.1 CSS的概念 1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的文字效果 ...
第1章 CSS的初步体验 1.1 CSS的概念 1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的文字效果 ...
- 日历的动态显示和隐藏：用户可以通过点击按钮来切换显示日历。 - 日期选择：用户可以选择特定日期，并触发相关事件的显示或编辑。 - 事件添加和编辑：用户可以添加新的课程或活动，并保存到数据库。 - 提醒...
在网页开发中，Datepicker是一种常见的时间选择控件，它为用户提供了一个友好的界面来选择日期或日期范围。本教程将深入探讨Datepicker时间控件的使用，通过代码实例帮助你理解和实现这一功能。 首先，Datepicker...
【标题】"VignanCalendar-:我的第一个开发项目"是一个初学者的开发作品，它可能是一个个人项目，用于展示作者在Web开发领域的初步技能。这个项目可能涉及到创建一个日历应用，允许用户查看和管理日期相关的事件。从...
7.2.1 初步认识SQL Server 2005 7.2.2 创建数据库 7.2.3 删除数据库 7.2.4 备份数据库 7.2.5 还原数据库 7.2.6 创建表 7.2.7 删除表 7.2.8 创建数据库关系图 7.3 ADO.NET 连接SQL 数据库 7.3.1 ADO.NET 基础 7.3.2 ...
7.2.1 初步认识SQL Server 2005 7.2.2 创建数据库 7.2.3 删除数据库 7.2.4 备份数据库 7.2.5 还原数据库 7.2.6 创建表 7.2.7 删除表 7.2.8 创建数据库关系图 7.3 ADO.NET连接SQL数据库 7.3.1 ADO.NET基础 7.3.2 连接...
7.2.1 初步认识SQL Server 2005 7.2.2 创建数据库 7.2.3 删除数据库 7.2.4 备份数据库 7.2.5 还原数据库 7.2.6 创建表 7.2.7 删除表 7.2.8 创建数据库关系图 7.3 ADO.NET连接SQL数据库 7.3.1 ADO.NET基础 7.3.2 连接...
7.2.1 初步认识SQL Server 2005 7.2.2 创建数据库 7.2.3 删除数据库 7.2.4 备份数据库 7.2.5 还原数据库 7.2.6 创建表 7.2.7 删除表 7.2.8 创建数据库关系图 7.3 ADO.NET连接SQL数据库 7.3.1 ADO.NET基础 7.3.2 连接...
7.2.1 初步认识SQL Server 2005 7.2.2 创建数据库 7.2.3 删除数据库 7.2.4 备份数据库 7.2.5 还原数据库 7.2.6 创建表 7.2.7 删除表 7.2.8 创建数据库关系图 7.3 ADO.NET连接SQL数据库 7.3.1 ADO.NET基础 7.3.2 连接...
7.2.1 初步认识SQL Server 2005 7.2.2 创建数据库 7.2.3 删除数据库 7.2.4 备份数据库 7.2.5 还原数据库 7.2.6 创建表 7.2.7 删除表 7.2.8 创建数据库关系图 7.3 ADO.NET连接SQL数据库 7.3.1 ADO.NET基础 7.3.2 连接...