javascript - 带输入的 Javascript 计时器
问题描述
我正在尝试创建一个能够接收输入的交互式计时器。如何在下面的代码中添加输入,以便我能够从用户那里获得时间(例如以分钟为单位),以便我可以为计时器计时?
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">
<link href="styles.css" rel="stylesheet">
<title>Timer</title>
</head>
<script src='homepage.js'></script>
<body>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Timer</li>
</ol>
</nav>
<center>
<div>
<form onsubmit="timer(); return false;">
<input type="submit" value='Start' class='button button1'>
</form>
<h1 id='demo'></h1>
<form onsubmit="stopper();">
<input type="submit" value='Stop' class='button button2'>
</form>
</div>
</center>
</body>
Javascript
function stopper() {
let stop = true;
}
let stop = false;
function timer() {
// Set the date we're counting down to
var countDownDate = new Date("Jan 5, 2021 15:37:25").getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get today's date and time
var now = new Date().getTime();
// Find the distance between now and the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Display the result in the element with id="demo"
document.getElementById("demo").innerHTML = days + " : " + hours + " : " + minutes + " : " + seconds;
// If the count down is finished, write some text
if (distance < 0) {
document.getElementById("demo").innerHTML = 'Times up!';
alert('Times up!');
}
}, 1000);
if (stop === true) {
return;
}
}
-------------------------------------------------- -------------------------------------------------- -------------------------------------------------- -------------------------------------------------- ----------------------------------
解决方案
console.log
通过替换为实际逻辑来尝试以下代码段。
setTimeout(() => {
console.log('logic timedout')
}, parseInt(prompt()) * 1000)
推荐阅读
- javascript - 开玩笑防止节点模块被导入
- visual-studio-2019 - Visual Studio 2019 发布(或从服务器替换)单个选定文件不可用
- python - 如何通过 Pandas 中的循环加入多个 DataFrame?
- file - 我无法通过 Flywheel 从本地加载 WordPress
- r - 无法在 R Shiny 中使用 renderDT 修复第一列?
- ocaml - 语法错误:caml 中的操作员预期是什么意思?
- javascript - 无法删除或更新父行:外键约束失败 - 续集
- mariadb - Maria DB 备份生成零 KB 文件且没有错误
- swift - 如何在 SwiftUI 中的每个视图上显示 AdMob 横幅
- php - 通过php下载zip