如何让程序按照文本框中的秒数进行倒计时?
花儿丶落了
2015-10-26 13:43
这是我的代码,直接运行,num是空,总是要程序运行一次,num才变化
<!DOCTYPE html>
<html>
<head>
<title>浏览器对象</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<!--先编写好网页布局-->
<h2>操作成功</h2>
<p><span id="countnum">10</span>秒后回到首页 <a href="javascript:window.history.forward()">返回</a></p>
<form action="" name="form1">
<input type="button" name="" value="开始"onclick="count()" id="button1">
<input type="button" name="" value="停止" id="button2" onclick="stop()">
<input type="text" name="" value="" placeholder="" id="second">
<script type="text/javascript">
var num = parseInt(document.getElementById("second").value)
var i
function count(){
if (num>0) {
window.document.getElementById("countnum").innerHTML = num
document.getElementById("button1").disabled = true
} else{
document.getElementById("button1").disabled = false
window.location.href = "http:www.baidu.com"
};
num--
i = setTimeout("count()", 1000)
}
function stop () {
clearTimeout(i)
document.getElementById("button1").disabled = false
// body...
}
//获取显示秒数的元素，通过定时器来更改秒数。
//通过window的location和history对象来控制网页的跳转。
</script>
</form>
</body>
</html>
3回答
-
- DeLM
- 2015-11-17 11:31:46
用innerHTML的属性直接替换 HTML 元素的内容。
-
- 花儿丶落了
- 2015-10-27 09:21:18
<!DOCTYPE html>
<html>
<head>
<title>浏览器对象</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<!--先编写好网页布局-->
<h2>操作成功</h2>
<p><span id="countnum">10</span>秒后回到首页 <a href="javascript:window.history.forward()">返回</a></p>
<form action="" name="form1">
<input type="button" name="" value="开始"onclick="count()" id="button1">
<input type="button" name="" value="停止" id="button2" onclick="stop()">
<input type="text" name="" value="" placeholder="" id="second" onblur="aa()">
<!-- 添加一个文本框失焦的事件,在此函数中给num赋值并返回num即可, -->
<script type="text/javascript">
var num //将num定义为全局变量
var i
function aa(){
num = parseInt(document.getElementById("second").value)
return num
}
function count(){
if (num>0) {
window.document.getElementById("countnum").innerHTML = num
document.getElementById("button1").disabled = true
} else{
document.getElementById("button1").disabled = false
window.location.href = "http:www.baidu.com"
};
num--
i = setTimeout("count()", 1000)
}
function stop () {
clearTimeout(i)
document.getElementById("button1").disabled = false
document.getElementById("second").focus()
document.getElementById("second").select()
// body...
}
//获取显示秒数的元素，通过定时器来更改秒数。
//通过window的location和history对象来控制网页的跳转。
</script>
</form>
</body>
</html>已经解决了,主要就是文本框中的值在改变之后要给num复制,所以我增加了一个文本框的失焦时间来给num赋值.
-
- qq_风的味道_1
- 2015-10-26 15:05:32
var count = document.getElementById('count');
var a = document.getElementsByTagName('a')[0];
var num = 5;
var timer = setInterval(function () {
num--;
count.innerHTML = num;
if (num == 0) {
//window.history.back();
count.innerHTML = 0;
clearInterval(timer);
} else{
};
JavaScript进阶篇
468060 学习 · 21891 问题
相似问题