| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 4302 人关注过本帖, 1 人收藏
标题:[原创]菜鸟应用JAVASCRIPT 之 简易闹钟程序
只看楼主 加入收藏
编程之星
Rank: 5Rank: 5
等 级:职业侠客
威 望:2
帖 子:285
专家分:391
注 册:2007-4-10
收藏(1)
 问题点数:0 回复次数:4 
[原创]菜鸟应用JAVASCRIPT 之 简易闹钟程序
*/ --------------------------------------------------------------------------------------
*/ 出自: 编程中国 http://www.bc-cn.net
*/ 作者: 编程之星 E-mail:rostar@126.com QQ:150163704
*/ 时间: 2007-9-2 编程论坛首发
*/ 声明: 尊重作者劳动,转载请保留本段文字
*/ --------------------------------------------------------------------------------------


菜鸟应用JAVASCRIPT 之 简易闹钟程序
——编程之星
2008-9-2
大家好,今天我们来学习一下用Javascript来写出一个简单的网页闹钟程序.先简单地介绍一下这个简单的程序吧.该程序能够在你设定的时间(响铃时间)到后给你提示,当然你可以自定义提示信息,你还可以设置在指定的时间到后播放你所指定的歌曲,用来提醒你,你设置的时间已经到了,这样就达到这类似闹钟的效果啦.其实还有其他方法来实现闹钟效果的,我曾经用VBscript来写过一个闹钟程序,所采用的算法就和本程序采用的不一样, 也许本程序所采用的算法比较笨,这可能和本人的IQ有关,采用这种算法的原因除了本人比较笨以外,还有就是Javascript和VBscript语言本身的差异,尽管这个闹钟程序很简单了,但用VBscript可以更加简单的实现(这是我的个人愚见).

程序测试连接:http://rostar.xinwen520.net/简易闹钟程序.html



程序完整源代码:

<html>
<head>
<script>
var AlarmTimeSet=new Date();
function AlarmClock()
{
var AlarmMessage=SMS.value;
var TimeNowSet=new Date();
var AlarmTime=new Date(AlarmTimeSet.getFullYear(),AlarmTimeSet.getMonth()+1,AlarmTimeSet.getDate(),H.value,M.value,S.value);
var TimeNow=new Date(TimeNowSet.getFullYear(),TimeNowSet.getMonth()+1,TimeNowSet.getDate(),TimeNowSet.getHours(),TimeNowSet.getMinutes(),TimeNowSet.getSeconds())
if(TimeNow.getTime() == AlarmTime.getTime())
{
if(OPENMUSIC.checked)
{
document.write("<embed autostart='true' src="+MUSIC.value+">");
document.write("<p>");
document.write("<a href='javascript:history.back()'>返回闹钟程序</a>");
}
if(AlarmMessage=="")
{
alert("时间到啦");
}else{
alert(AlarmMessage);
}
return;
}else if(AlarmTime.getTime() < TimeNow.getTime()){
alert("时间已过期");
return;
}
setTimeout("AlarmClock()",500);
}
</script>
</head>
<body>
提示信息<input id="SMS" size="30">
<br>
音乐地址<input id="MUSIC" size="30">
<input id="OPENMUSIC" type="checkbox">音乐播放
<p>
<b>设定闹钟时间:</b>

时<input id="H" size="5">
分<input id="M" size="5">
秒<input id="S" size="5">
<button onclick="AlarmClock()">确定</button>
</body>
</html>

程序分析:
该程序比较简单!首先我们来看看第1句代码var AlarmTimeSet=new Date();
这表示创建一个Date对象AlarmTimeSet.接下来我们看看AlarmClock()函数的内部.
在函数内部,我们首先看到var AlarmMessage=SMS.value;这句表示用户自定义的闹钟提示信息.然后看到第二句var TimeNowSet=new Date();TimeNowSet对象用来对当前时间的设置,应该闹钟的程序原理就是用当前的时间和设定的时间相对比,如果当前的时间和设定的时间一致的话,那么闹钟就应该响铃了.下面来看看比较长的一句var AlarmTime=new Date(AlarmTimeSet.getFullYear(),AlarmTimeSet.getMonth()+1,AlarmTimeSet.getDate(),H.value,M.value,S.value);这表示设定要响铃的时间, getFullYear()、getMonth()、getDate()都是Javascrip内部对象Date的方法,分别代表取得年份(4位)、月份(0~11之间)、日期(1~31之间), H.value、M.value、S.value就分别是提取时、分、秒了,这样闹钟的响铃时间就已经设定了.接下来,我们来看看更长的一句var TimeNow=new Date(TimeNowSet.getFullYear(),TimeNowSet.getMonth()+1,TimeNowSet.getDate(),TimeNowSet.getHours(),TimeNowSet.getMinutes(),TimeNowSet.getSeconds());这表示最终设定当前的时间,因为Javascript对时间对象的操作要比VBscript复杂一些,所以代码就要长一些. getHours()、getMinutes()、getSeconds()分别代表取得Date对象的时、分、秒.到这里当前时间和响铃时间都已经设置好啦,那么现在就要开始下面的代码了,下面的代码是嵌套的if结构块.先看外层的if结构吧, if(TimeNow.getTime() == AlarmTime.getTime())这表示如果当前的时间和响铃的时间一致,那么就执行外层if结构块内部的两个if结构.否则如果AlarmTime.getTime()< TimeNow.getTime()就提示时间已经过期.如果到了响铃的时间,即TimeNow.getTime()== AlarmTime.getTime(),那么就开始判断”音乐播放”复选框是否选取,如果点取的该复选框(OPENMUSIC.checked)那么就播放歌曲,document.write(…)这几句代码不用解释了吧.如果”提示信息”文本框没有填入提示信息,那么就采用默认的提示信息—“时间到啦”,如果填写了提示信息,那么就弹出设置的提示信息.然后,return语句表示返回(退出)该函数. setTimeout("AlarmClock()",500);表示每隔半秒就递归执行一次AlarmClock()函数,检测当前时间是否和响铃的时间一致.

总结:
程序分析完毕,希望大家有收益.

大家可以下载此程序代码

3lNQnjn1.rar (8.26 KB) 菜鸟应用JAVASCRIPT 之 简易闹钟程序


编程之星的菜鸟应用JAVASCRIPT系列:

菜鸟应用JAVASCRIPT 之 简单图片浏览

菜鸟应用JAVASCRIPT 之 随机广告程序

菜鸟应用JAVASCRIPT 之 简易网页音乐播放程序


[此贴子已经被作者于2007-9-2 22:57:06编辑过]

搜索更多相关主题的帖子: JAVASCRIPT 闹钟 应用 
2007-09-02 20:38
zhongx
Rank: 2
等 级:论坛游民
威 望:1
帖 子:370
专家分:42
注 册:2007-8-16
收藏
得分:0 
很好的一个小程序,可惜不能设置日期,如能做到在其它的页面显示提示更隹.

感动常在,每天进步一点点,开心学习在编程论坛。
http://www.
2007-09-08 20:31
编程之星
Rank: 5Rank: 5
等 级:职业侠客
威 望:2
帖 子:285
专家分:391
注 册:2007-4-10
收藏
得分:0 
如果连设置日期的功能也写进去的话并不难实现,但好像不大现实,一般很少有人将一个网页一直打开多少天的时间吧.
如果大家喜欢的话,也可以自己改进呀.

怎么越学就觉得自己越笨
2007-09-09 17:51
xinxue
Rank: 1
等 级:新手上路
帖 子:128
专家分:0
注 册:2006-2-28
收藏
得分:0 
回复 1# 的帖子
写的不错,支持
2007-12-02 15:23
leo715
Rank: 1
等 级:新手上路
帖 子:1
专家分:0
注 册:2011-8-17
收藏
得分:0 
时隔4年,我才开始学习~~
谢谢LZ,很实用~
2011-08-17 15:09
快速回复:[原创]菜鸟应用JAVASCRIPT 之 简易闹钟程序
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.016838 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved