求Javascript 网页倒计时代码
请大虾们帮忙做一个倒计时器的网页代码{Javascript}，仅有的分数全给了，希望能帮帮我，多谢！要求如下：①.2个文本框输入倒计时的总时间，文本框a输入分钟数，文本框...
请大虾们帮忙做一个倒计时器的网页代码{Javascript}，仅有的分数全给了，希望能帮帮我，多谢！
要求如下：
①.2个文本框输入倒计时的总时间，文本框a输入分钟数，文本框b输入秒数
②2个按钮，按钮a初始文字为“开始倒计时”单击后判断文本框a、b的值，如果a或者b文本框内容同时为空或者不为数字，或者数字不大于0，则提示“请输入正确时间”，同时文本框a、b内容清空，所有内容复位；若a、b文本框内容为数字且时间大于0则开始倒计时，并且按钮文字变成“暂停倒计时”，再次单击该按钮a倒计时暂停；
按钮b为复位按钮，单击后强制清空a、b文本框中的内容，所有内容复位。
③倒计时时间到0结束时，弹出提示提示框，显示：时间到！关闭提示框之后，所有内容复位。
④最好是一个单页。
要求②那里的按钮a单击后开始计倒计时，再次单击暂停倒计时，再单击又继续倒计时，一直循环，直到倒计时结束，或者按了按钮b复位。 展开
要求如下：
①.2个文本框输入倒计时的总时间，文本框a输入分钟数，文本框b输入秒数
②2个按钮，按钮a初始文字为“开始倒计时”单击后判断文本框a、b的值，如果a或者b文本框内容同时为空或者不为数字，或者数字不大于0，则提示“请输入正确时间”，同时文本框a、b内容清空，所有内容复位；若a、b文本框内容为数字且时间大于0则开始倒计时，并且按钮文字变成“暂停倒计时”，再次单击该按钮a倒计时暂停；
按钮b为复位按钮，单击后强制清空a、b文本框中的内容，所有内容复位。
③倒计时时间到0结束时，弹出提示提示框，显示：时间到！关闭提示框之后，所有内容复位。
④最好是一个单页。
要求②那里的按钮a单击后开始计倒计时，再次单击暂停倒计时，再单击又继续倒计时，一直循环，直到倒计时结束，或者按了按钮b复位。 展开
2个回答
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
var timer;
//开始
function Start() {
var min = document.getElementById("min");
var sec = document.getElementById("sec");
if ((min.value == "") && (sec.value == "")) {
alert("请输入正确时间");
} else {
document.getElementById("start").style.display = "none";
document.getElementById("stop").style.display = "block";
clearInterval(timer);
timer = setInterval(function() {
if (min.value == 0 && sec.value == 0) {
alert('时间到 !');
Reset();
}
if (sec.value > 0) {
sec.value--;
}
if (sec.value == 0) {
if (min.value > 0) {
sec.value = 59;
min.value--;
}
}
}, 1000);
}
}
//暂停
function Stop() {
clearInterval(timer);
document.getElementById("start").style.display = "block";
document.getElementById("stop").style.display = "none";
}
function Reset() {
clearInterval(timer);
var min = document.getElementById("min");
var sec = document.getElementById("sec");
min.value = "";
sec.value = "";
document.getElementById("start").style.display = "block";
document.getElementById("stop").style.display = "none";
}
</script>
<style type="text/css">
#min{width:100px;}
#sec{width:100px;}
#start {
position:absolute;
top:120px;
width:40px;
height:30px;
display: block;
}
#stop {
position:absolute;
top:120px;
width:40px;
height:30px;
display: none;
}
#reset{
position:absolute;
top:120px;
left:70px;
width:40px;
height:30px;
}
</style>
</head>
<body>
<h1>倒计时器</h1>
<!-- input 限制只能输入数字-->
<input type="text" id="min"
onkeyup='this.value=this.value.replace(/\D/g,"")' /> 分
<input type="text" id="sec"
onkeyup='this.value=this.value.replace(/\D/g,"")' /> 秒
<input id="start" type="button" value="开始" onclick="Start()" />
<input id="stop" type="button" value="暂停" onclick="Stop()" />
<input id="reset" type="button" value="复位" onclick="Reset()" />
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
AiPPT
2024-09-19 广告
随着AI技术的飞速发展，如今市面上涌现了许多实用易操作的AI生成工具1、简介：AiPPT: 这款AI工具智能理解用户输入的主题，提供“AI智能生成”和“导入本地大纲”的选项，生成的PPT内容丰富多样，可自由编辑和添加元素，图表类型包括柱状图...
点击进入详情页
本回答由AiPPT提供
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
