📄 5-22.html

📁 《深入浅出Ajax》源代码
💻 HTML
字号:
<HTML>
<HEAD>
<TITLE> AJAX深入浅出--代码5-22</TITLE>
</HEAD>
<BODY>
<input id="startClock" type="button" value="启动钟表" onclick="startClock();"><input id="stopClock" type="button" value="停止钟表" onclick="stopClock();" disabled>
<BR><BR>
<input id="startCount" type="button" value="启动计数" onclick="startCount();"><input id="stopCount" type="button" value="停止计数" onclick="stopCount();" disabled>
<BR><BR>
<TABLE border="2">
<TR>
	<TD>当前时间是</TD>
	<TD id="timeTd">&nbsp;</TD>
</TR>
<TR>
	<TD>当前计数是</TD>
	<TD id="countTd">&nbsp;</TD>
</TR>
</TABLE>
</BODY>
</HTML>
<script language="javascript">
var clockTimer = null;
//启动钟表
function startClock() {
	//设定一秒钟执行一次
	clockTimer=setInterval("clockCallFun()",1000);
	//改变按钮状态
	document.getElementById("startClock").disabled=true;
	document.getElementById("stopClock").disabled=false;
}
//停止钟表
function stopClock() {
	//清除定时执行
	clearInterval(clockTimer);
	//改变按钮状态
	document.getElementById("startClock").disabled=false;
	document.getElementById("stopClock").disabled=true;
}
//一秒钟调用一次该函数
function clockCallFun() {
	//获取时间串
	var now = new Date();
	var hours = now.getHours();
	var minutes = now.getMinutes();
	var seconds = now.getSeconds();
	var timeValue = "" + ((hours >12) ? hours -12 :hours);
	timeValue += ((minutes < 10) ? ":0" : ":") + minutes;
	timeValue += ((seconds < 10) ? ":0" : ":") + seconds;
	timeValue += (hours >= 12) ? " P.M." : " A.M.";
	//将时间串进行显示
	document.getElementById("timeTd").innerHTML=timeValue;
}
var countTimer = null;
var count = 0;
//启动计数
function startCount() {
	//设定一秒钟执行一次
	countTimer=setInterval("countCallFun()",1000);
	//改变按钮状态
	document.getElementById("startCount").disabled=true;
	document.getElementById("stopCount").disabled=false;
}
//停止计数
function stopCount() {
	//清除定时执行
	clearInterval(countTimer);
	//改变按钮状态
	document.getElementById("startCount").disabled=false;
	document.getElementById("stopCount").disabled=true;
}
//一秒钟调用一次该函数
function countCallFun() {
	//将计数值进行显示
	document.getElementById("countTd").innerHTML=count++;
}
</script>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -