目标是创建一个网页来计算用户访问该网页的时间。我的方法是使用秒表来显示用户在页面上的时间。我还使用了 window.onblur() 函数来查看用户是否位于同一网页上。这两个代码本身运行得很好。我只是无法将它们制作成一个程序。
Stopwatch program:
<!DOCTYPE html>
<html>
<body>
<h1 font size= 55 align= "center"><time>00:00:00</time></h1>
<h2 id= "mee" align= "center"></h2>
<h3 id="she" align= "center"></h3>
<button id="start" class= "fof"align= "center">start</button>
<button id="stop" align= "center">stop</button>
<button id="clear" align= "center">clear</button>
<style>
.fof{ height: 50px;
border-radius: 50px;
}
</style>
<script>
var h1 = document.getElementsByTagName('h1')[0],
start = document.getElementById('start'),
stop = document.getElementById('stop'),
clear = document.getElementById('clear'),
seconds = 0, minutes = 0, hours = 0,
t;
function add() {
seconds++;
if (seconds >= 60) {
seconds = 0;
minutes++;
if (minutes >= 60) {
minutes = 0;
hours++;
}
}
h1.textContent = (hours ? (hours > 9 ? hours : "0" + hours) : "00")
+ ":" + (minutes ? (minutes > 9 ? minutes : "0" + minutes) : "00")
+ ":" + (seconds > 9 ? seconds : "0" + seconds);
timer();
}
function timer() {
t = setTimeout(add, 1000);
}
timer();
/* Start button */
start.onclick = timer;
/* Stop button */
stop.onclick = function() {
clearTimeout(t);
document.getElementById("mee").innerHTML= minutes;
document.getElementById("she").innerHTML= seconds;
}
/* Clear button */
clear.onclick = function() {
h1.textContent = "00:00:00";
seconds = 0; minutes = 0; hours = 0;
}
</script>
</body>
</html>
Program to see if user is on same webpage:
var quitter = false;
window.onblur = function () {
if(!quitter){
quitter = true;
alert('You left');
}
最佳答案
检查下面的 fiddle
https://jsfiddle.net/yogesh078/5vfxk9e1/1/
Javascript代码:
var h1 = document.getElementsByTagName('h1')[0],
start = document.getElementById('start'),
stop = document.getElementById('stop'),
clear = document.getElementById('clear'),
seconds = 0,
minutes = 0,
hours = 0,
t;
var timerRunning = false;
function add() {
seconds++;
if (seconds >= 60) {
seconds = 0;
minutes++;
if (minutes >= 60) {
minutes = 0;
hours++;
}
}
h1.textContent = (hours ? (hours > 9 ? hours : "0" + hours) : "00") +
":" + (minutes ? (minutes > 9 ? minutes : "0" + minutes) : "00") +
":" + (seconds > 9 ? seconds : "0" + seconds);
timer();
}
function timer() {
if (timerRunning) {
clearTimeout(t);
}
t = setTimeout(add, 1000);
timerRunning = true;
}
timer();
/* Start button */
start.onclick = timer;
/* Stop button */
stop.onclick = function() {
clearTimeout(t);
timerRunning = false;
document.getElementById("mee").innerHTML = minutes;
document.getElementById("she").innerHTML = seconds;
}
/* Clear button */
clear.onclick = function() {
h1.textContent = "00:00:00";
seconds = 0;
minutes = 0;
hours = 0;
}
var quitter = false;
window.onblur = function() {
clearTimeout(t);
timerRunning = false;
quitter = true;
alert('You left');
}
window.onmousemove = function() {
if (!timerRunning) {
timer();
}
};
关于javascript - 尝试在 JS 中运行此代码。，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45645279/