看看谁是JavaScript高手！！(一道动态刷新测试题)

金玉满堂5 2011-09-14 01:59:59

创建一个html 页面，上面有个一个text文本框，文本框的时间可以动态刷新，每隔5秒刷新一次。
当点击文本框时，text 下面动态创建DIV，DIV里记录本次点击的序号和当前时间。

...全文

206 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

asdl7878 2011-09-14

打赏
举报

重在参与呵呵

金玉满堂5 2011-09-14

打赏
举报

不错，这位师兄也写的很好！不过我都结贴了。

asdl7878 2011-09-14

打赏
举报

交卷！是这样呗？
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script language="javascript" type="text/javascript">
var today;
var h;
var m;
var s;
var clickCount=0;
function tick(){

today=new Date();
h=today.getHours();
m=today.getMinutes();
s=today.getSeconds();

if(h<10){h="0"+h}
if(m<10){m="0"+m}
if(s<10){s="0"+s}
document.getElementById('nowtxt').value=h+":"+m+":"+s;
a=setTimeout(tick,5000);
}
function createDiv(){

clickCount++;
var divObj=document.createElement('div');
divObj.style.width="100px"
divObj.innerHTML="当前序号:"+clickCount+"<br>"+"点击时间:"+document.getElementById('nowtxt').value;
if(clickCount%2!=0){
divObj.style.backgroundColor="yellow";
}
document.getElementById('contentDiv').appendChild(divObj);
}

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<body onLoad="tick()">
<input type="text" id="nowtxt" style="width:100px" onclick="createDiv()">
<br>
<div id="contentDiv" style=" font-size:12px">

</div>
</body>
</html>

金玉满堂5 2011-09-14

打赏
举报

师兄，太强了，简直太强了，这么快就搞定，不愧是高手。

001007009 2011-09-14

打赏
举报

楼主的作业啊？
。。。。

试试



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>

<html>

    <head>

        <title></title>

        <style type="text/css">

			#div { padding:5px; width:220px; height:60px; border:1px solid #daa; font-size:14px; }

        </style>

    </head>

    <body>

		<input type="text" id="test" />

		<script>

			function $(o){return document.getElementById(o)}

			function showTime(){

				var date = new Date();

				date = date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();

				$('test').value = date;

			}

			var count = 1, div;

			showTime();

			setInterval(showTime,1000);

			$('test').onfocus = function(){

				var date = new Date();

				date = date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();

				div = document.createElement('div');

				div.innerHTML = '第 <span style="color:red">' + count + '</span> 次 ' + date;

				div.id = 'div';

				document.body.appendChild(div);

				count++;

			}

			$('test').onblur = function(){

				document.body.removeChild($('div'))

			}

		</script>

    </body>

</html>