JavaScript电子表[1]

[入库:2005年8月18日] [更新:2007年3月24日]

本文简介:选择自 cl007 的 blog

   在这个例子中将用javascript实现一个电子表。它是动态的。窍门在于时间对象的构造
和settimeout、cleartimeout方法的调用。以下是实现动态显示电子表的程序清单,你可以
将其拷贝到记事本,另存为*.html查看。在这么长的程序里,最关键的东西就是settimeout
("time()",1000),它每隔1秒(等于1000毫秒)调用一次time函数,time函数控制显示文本.浏览
这个超文本,将会看到每隔一秒,时间框里的内容会改变,就象一个电子表。


<html>
<head>
<title>动态显示时间</title>
<script language="javascript">

file://用来显示信息
function info()
{
     alert("这是用javascript实现的电子表。");
}
var timerid=null;
var timerrunning=false;

file://启动电子表
function startclock()
{
     stopclock();
     time();
}

file://停止运行电子表
function stopclock()
{
     if(timerrunning)
     cleartimeout(timerid);
     timerrunning=false;
}

file://电子表的实现模块
function time()
{
     file://使用new操作符创建时间对象
     var now=new date();
     var yr=now.getyear();
     var mname=now.getmonth()+1;
     var dname=now.getday()+1;
     var daynr=((now.getdate()<10)?"0":"")+now.getdate();
     var ampm=(now.gethours()>=12)?"下午":"上午"
     var hours=now.gethours();
     hours=((hours>12)?hours-12:hours);
     var minutes=((now.getminutes()<10)?":0":":")+now.getminutes();
     var seconds=((now.getseconds()<10)?":0":":")+now.getseconds();

     file://判断今天是星期几
     if(dname==1)day="sunday";
     if(dname==1)day="monday";
     if(dname==3)day="tuesday";
     if(dname==4)day="wednesday";
     if(dname==5)day="thursday";
     if(dname==6)day="friday";
     if(dname==7)day="saturday";

     file://判断月份
     if(mname==1)month="janauary";
     if(mname==2)month="february";
     if(mname==3)month="march";
     if(mname==4)month="april";
     if(mname==5)month="may";
     if(mname==6)month="june";
     if(mname==7)month="july";
     if(mname==8)month="august";
     if(mname==9)month="september";
     if(mname=10)month="october";
     if(mname=11)month="november";
     if(mname=12)month="december";

     var dayofweek=(""+day+"");
     document.forms[0].elements[0].value=dayofweek;
     var monthdayyear=(""+month+","+daynr+","+yr+"");
     document.forms[0].elements[1].value=monthdayyear;
     var timevalue=(""+hours+minutes+seconds+""+ampm);
     document.forms[0].elements[2].value=timevalue;
     timerid=settimeout("time()",1000);
     timerrunning=true;
}
</script>
</head>
<body onload="startclock()">
<center>javascript电子表</center>
<br>
<center>
<form>
<table border=3 width=500>

<tr>
<td align="center"><font color=800000 size=+1><strong>今天星期</strong></font>
<td align="center"><input type="text"name="local"size=13 value="weekday">
</tr>

<tr>
<td align="center"><font color=800000 size=+1><strong>日期</strong></font>
<td align="center"><input type="text" name="local" size=22 value="日期">
</tr>

<tr>
<td align="center"><font color=800000 size=+1><strong>时间</strong></font>
<td align="center"><input type="text" name="local" size=16 value="时间">
</tr>

</table>
<br>
<table border=0 widtn=400>

<tr>
<td align="center"><input type="button" value="停止" onclick="stopclock()">
<td align="center"><input type="button" value="继续" onclick="startclock()">
<td align="center"><input type="button" value="信息" onclick="info()">

本文关键:JavaScript
  相关方案
Google
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top