用户输入的时间是零，即使在javascript中它应该更多
用户输入的时间是零，即使在javascript中它应该更多
提问于 2021-01-24 04:00:58
我正在尝试计算从用户开始输入到停止输入的时间。我把两个变量分别放在start和end上，然后把它们减去。但它总是返回零。如果可能的话，你能给出一个简单的方法来计算wpm吗？最后，当用户输入正确的10个单词时，我想计算每分钟的单词数。所以我需要从他们开始到他们完成提示的时间。
谢谢!
Javascript：
var input = document.getElementById("boch");
input.addEventListener("keyup", function (event) {
if (event.keyCode === 13) {
event.preventDefault();
document.getElementById("bocho").click();
}
});
var element = document.querySelector("#boch");
element.onkeyup = function () {
var value = element.value;
if (value.includes("m")) {
var start = Date.now();
}
if (value.includes("man")) {
document.getElementById('word-1').style.backgroundColor = 'green';
} else {
document.getElementById('word-1').style.backgroundColor = "red";
}
if (value.includes("man become")) {
document.getElementById('word-2').style.backgroundColor = 'green';
} else {
document.getElementById('word-2').style.backgroundColor = "red";
}
if (value.includes("man become as")) {
document.getElementById('word-3').style.backgroundColor = 'green';
} else {
document.getElementById('word-3').style.backgroundColor = "red";
}
if (value.includes("man become as and")) {
document.getElementById('word-4').style.backgroundColor = 'green';
} else {
document.getElementById('word-4').style.backgroundColor = "red";
}
if (value.includes("man become as and through")) {
document.getElementById('word-5').style.backgroundColor = 'green';
} else {
document.getElementById('word-5').style.backgroundColor = "red";
}
if (value.includes("man become as and through find")) {
document.getElementById('word-6').style.backgroundColor = 'green';
} else {
document.getElementById('word-6').style.backgroundColor = "red";
}
if (value.includes("man become as and through find would")) {
document.getElementById('word-7').style.backgroundColor = 'green';
} else {
document.getElementById('word-7').style.backgroundColor = "red";
}
if (value.includes("man become as and through find would here")) {
document.getElementById('word-8').style.backgroundColor = 'green';
} else {
document.getElementById('word-8').style.backgroundColor = "red";
}
if (value.includes("man become as and through find would here and")) {
document.getElementById('word-9').style.backgroundColor = 'green';
} else {
document.getElementById('word-9').style.backgroundColor = "red";
}
if (value.includes("man become as and through find would here and before")) {
document.getElementById('word-10').style.backgroundColor = 'green';
} else {
document.getElementById('word-10').style.backgroundColor = "red";
}
if (value.includes("man become as and through find would here and before")) {
var end = Date.now();
}
let millis = end-start;
console.log(millis)
}HTML：
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>repl.it</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<h1>
<span id="word-1">man</span> <span id="word-2">become</span> <span id="word-3">as</span>
<span id="word-4">and</span> <span id="word-5">through</span> <span id="word-6">find</span> <span id="word-7">would</span> <span id="word-8">here</span> <span id="word-9">and</span> <span id="word-10">before</span>
</h1>
<input type="text" id="boch" autocomplete="off">
</div>
<div id="typing-area">
<button id="bocho" onclick="document.getElementById('boch').value = ''">Enter</button>
</html>
<script src="main.js"></script>```回答 1
Stack Overflow用户
回答已采纳
发布于 2021-01-24 04:03:59
首先，value.includes("m")每次都是真的，所以每次触发函数时计时器都会重新启动。相反，请使用value === "m"
if (value === "m") {
start = Date.now();
}您需要在if语句外部声明var end和var start，并将其设置在内部：
var start;
if (value === "m") {
start = Date.now();
}
// other code...
var end;
if (value.includes("man become as and through find would here and before")) {
end = Date.now();
}
let millis = end-start;另外，我建议在end和start之间留一个空格。end-start可以是一个变量名。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65863799
复制相关文章
相似问题
腾讯云开发者
