`
hot88zh
  • 浏览: 182854 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JavaScript日历2

阅读更多
<style type="text/css">
.tdclass {font-size: 9pt; padding: 4px}
</style>
<table cellspacing="0" cellpadding="0" border="0" align="center" bordercolor="white">
<tr align="center" bgcolor="#7BA5CE">
<td class="tdclass"><font color="white">公元 <span id="layerYear"></span>年<span id="layerMonth"></span>月<span id="layerDay"></span>日 星期<span id="layerWeek"></span></font></td>
</tr>
<tr align="center">
<td>
<span id="layerCalendar"></span>
</td>
</tr>
<tr align="center">
<td class="tdclass" bgcolor="#7BA5CE"><font color="white">现在时间:<span id="layerNow"></span></font></td>
</tr>
</table>
<script language="JavaScript" type="text/javascript">
<!--
// Written by caocao
// caocao@eastday.com
// http://nethermit.yeah.net
var dayArray=new Array("日","一","二","三","四","五","六");
var monthArray=[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
var stringTable="<table cellspacing=\"0\" cellpadding=\"0\" border=\"1\" align=\"center\" bordercolor=\"#8F8FAF\"><tr bgcolor=\"#53A9FF\" align=\"center\">";
for (var i=0; i<dayArray.length; ++i)
{
 stringTable+="<td class=\"tdclass\"><font color=\"white\"><b>"+dayArray[i]+"</b></font></td>";
}
stringTable+="</tr>";
function setValue(tag, str)
{
 document.getElementById(tag).innerHTML=str;
}
function showTime()
{
 var today=new Date();
 var currentYear=today.getFullYear()
 if (((currentYear%4==0)&&(currentYear%100!=0))||(currentYear%400==0))
  monthArray[1]=29;
 var allDays=monthArray[today.getMonth()];
 var currentWeek=today.getDay();
 var currentDay=today.getDate();
 var i=currentDay%7-currentWeek;
 var threshold=(7+i)%7;
 var isEnd=false;
 var stringAll=stringTable;
 while (true)
 {
  if (isEnd)
  {
   stringAll+="<td class=\"tdclass\" bgcolor=\"#EEEEEE\"> </td>";
   if (i % 7==(threshold+6)%7)
   {
    stringAll+="</tr>";
    break;
   }
  }
  else
  {
   if (i % 7==threshold)
    stringAll+="<tr align=\"center\">";
   stringAll+=i>0?"<td class=\"tdclass\""+(i==currentDay?" bgcolor=\"#FEA477\" style=\"color: #FFFFFF\"":"")+"><b>"+i+"</b></td>":"<td class=\"tdclass\" bgcolor=\"#EEEEEE\"> </td>";
   if (i % 7==(threshold+6)%7)
   {
    stringAll+="</tr>";
    if (i==allDays)
     break;
   }
   if (i==allDays)
    isEnd=true;
  }
  ++i;
 }
 stringAll+="</table>";
 setValue("layerYear", currentYear);
 setValue("layerMonth", today.getMonth()+1);
 setValue("layerDay", currentDay);
 setValue("layerWeek", dayArray[currentWeek]);
 setValue("layerCalendar", stringAll);
 setValue("layerNow", today.getHours()+":"+today.getMinutes()+":"+today.getSeconds());
 setTimeout("showTime()",1000);
}
showTime()
// -->
</script>

 

分享到:
评论

相关推荐

    javascript 日历2

    总结来说,“javascript 日历2”是一个带有清除功能的JavaScript日历控件,它增强了用户在网页上选择日期的体验。通过分析和修改`calendar.js`的源代码,开发者可以进一步定制这个控件,以满足特定项目的需求。

    JavaScript日历控件 六种日历

    - "现在时间日历"的文件(现在时间日历1.html和现在时间日历2.html)可能包含了一个实时显示当前日期和时间的功能。JavaScript的`Date`对象可以获取当前系统时间,并将其与日历控件结合,确保用户看到的是最新的...

    完美javascript日历大集合

    在这个“完美javascript日历大集合”中,我们可能会遇到一系列使用JavaScript实现的创新日历组件,这些组件可能包括各种设计风格、功能特性和适应性,旨在提升用户体验并增强网站的互动性。 日历组件是网页中常见的...

    javascript日历

    JavaScript日历是一个在网页上实现交互式日期选择功能的重要组件,尤其在开发各种Web应用程序时不可或缺。这个"javascript日历"描述的是一个响应性极高的日历解决方案,意味着它能够自适应不同设备和屏幕尺寸,提供...

    6种JavaScript日历控件

    JavaScript日历控件是网页开发中常用的一种交互元素,它为用户提供了一个直观的方式来选择日期,常见于表单、事件管理或在线预订系统等场景。在本文中,我们将深入探讨六种不同的JavaScript日历控件,了解它们的特点...

    js 日历 js日历 例子 javascript日历

    JavaScript日历是一个常见的网页交互元素,它为用户提供了一个方便的方式来选择日期,常见于表单填写、事件安排等场景。在Web开发中,JavaScript日历组件的实现主要依赖于JavaScript语言和CSS来完成页面布局和样式...

    javascript 日历

    JavaScript日历是一种常见的网页交互元素,它用于展示日期并允许用户选择特定的日期。在网页开发中,JavaScript日历通常与jQuery库结合使用,因为jQuery提供了丰富的DOM操作和动画效果,使得日历插件的实现更加简洁...

    JavaScript日历

    JavaScript日历是一款完全使用原生JavaScript编写的日历组件,它体现了JavaScript在前端开发中的强大功能,无需依赖任何外部库如Vue或jQuery。这个组件允许用户进行上下翻页以查看不同月份的日历,并且支持点击特定...

    个人收集的各种漂亮javascript日历

    - `cbscalendar`、`js日历`、`calendar`、`Calendar2`:这些可能是不同的JavaScript日历库或源代码文件,每一份可能代表一个独立的日历实现。 在实际应用中,开发者可以选择适合项目需求的日历控件,或者结合这些...

    javascript日历组件

    JavaScript日历组件是一种在网页上实现交互式日期选择功能的工具,它允许用户方便地查看和选择日期,常用于表单填写、事件预订或者时间安排等场景。在本案例中,我们有两个关键文件:`jscalendarx.htm` 和 `...

    javascript_日历源码

    2. **事件处理**:日历可能需要响应用户的点击、鼠标悬浮等交互,这就需要用到JavaScript的事件监听器,如`addEventListener`。例如,当用户点击某个月份的日期时,可以触发一个函数来处理选中日期的逻辑。 3. **...

    日文版javascript日历

    【标题】"日文版javascript日历"是一个专门针对日语环境设计的JavaScript日历控件,它提供了方便的日历显示和交互功能,尤其适用于需要日文日期展示的Web应用程序。这个控件不仅包含了完整的日历功能,还带有详细的...

    javascript日历插件

    JavaScript日历插件是一种网页应用程序中的交互式组件,它允许用户在网页上选择或输入日期和时间。这种插件通常由JavaScript代码实现,利用浏览器的DOM(文档对象模型)进行操作,提供用户友好的界面来处理日期选择...

    javascript小巧日历插件

    以下将详细介绍JavaScript日历插件的基本原理、核心功能以及如何使用。 首先,日历插件的核心是JavaScript代码,这里是`calendar.js`文件。这个文件包含了实现日历功能的主要逻辑,包括计算日期、展示日历视图、...

    javaScript日历控件大全

    JavaScript日历控件是网页开发中常用的一种交互元素,它为用户提供了一种直观的方式来选择日期。在本资源包中,包含了几种不同的JavaScript日历控件实现,供开发者根据项目需求选择和使用。下面我们将详细探讨...

Global site tag (gtag.js) - Google Analytics