如何快速学习:[1]Swift编程语言,Swift,苹果于2014年WWDC(苹果开发者大会)发布的新开发语言,可与Ojective-C*共同运行于MacOS和iOS平台,用于搭建基于苹果平台的应用程......
2023-03-17 350 编程语言
用setTimeout实现一个定时器功能
用HTML写个容器和一个开关,用来存放定时器的显示,开始和结束按钮来控制定时器的运行和关闭;代码下文或者如图:
html>
head>
title>定时器/title>
/head>
body>
input type = "text" id=content>
input type = button id=start value="开始">
input type = button id=stop value="结束">
/body>
/html>
用js对HTML进行控制,在适当的地方添加js代码,代码使用动态绑定事件,实现行为和结构分离,代码如下或者如图
script>
var s;
function $(id){
return document.getElementById(id);
}
function display(){
var date = new Date();
var str = date.getTime();
$("content").value = str;
s = setTimeout('display()',1000);
}
window.onload = function(){
$("start").onclick =function(){display();}
$("stop").onclick = function(){clearTimeout(s);}
}
/script>
吧上述的HTML和JavaScript代码进行整合到一起,形成如下代码:
直接双击就可以运行了;
html>
head>
title>定时器/title>
script>
var s;
function $(id){
return document.getElementById(id);
}
function display(){
var date = new Date();
var str = date.getTime();
$("content").value = str;
s = setTimeout('display()',1000);
}
window.onload = function(){
$("start").onclick =function(){display();}
$("stop").onclick = function(){clearTimeout(s);}
}
/script>
/head>
body>
input type = "text" id=content>
input type = button id=start value="开始">
input type = button id=stop value="结束">
/body>
/html>
以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!
标签: JAVASCRIPTHTML编程
相关文章
如何快速学习:[1]Swift编程语言,Swift,苹果于2014年WWDC(苹果开发者大会)发布的新开发语言,可与Ojective-C*共同运行于MacOS和iOS平台,用于搭建基于苹果平台的应用程......
2023-03-17 350 编程语言
web图表开发工具FineReport:[11]连续分组,数据库表数据是按照时间先后录入的,查询的时候希望按照时间先后,某个字段连续相同的话就合并起来显示,这样的报表可以通过相邻连续分组来实现。......
2023-03-17 574 编程语言