英文:
Uncaught ReferenceError, it says startTimer is not defined even though it is
问题
const startBtn = document.querySelector('.startBtn');
const pauseBtn = document.querySelector('.pauseBtn');
const ResetBtn = document.querySelector('.resetBtn');
const time = document.querySelector('.time');
let seconds = 0;
let secondsStr = '00';
let minutes = 0;
let minutesStr = '00';
let hours = 0;
let hoursStr = '00';
let timeText = `${hoursStr}:${minutesStr}:${secondsStr}`;
time.textContent = timeText;
function addSecond() {
seconds++;
secondsStr = seconds.toString();
if (seconds < 10) {
secondsStr = `0${secondsStr}`;
}
if (seconds >= 60) {
seconds = 0;
minutes++;
minutesStr = minutes.toString();
if (minutes < 10) {
minutesStr = `0${minutesStr}`;
}
if (minutes >= 60) {
minutes = 0;
hours++;
hoursStr = hours.toString();
if (hours < 10) {
hoursStr = `0${hoursStr}`;
}
}
}
timeText = `${hoursStr}:${minutesStr}:${secondsStr}`;
time.textContent = timeText;
}
let startTimer; // Declare the startTimer variable outside the functions.
startBtn.addEventListener('click', startWatch);
pauseBtn.addEventListener('click', pauseWatch);
function startWatch() {
startTimer = setInterval(addSecond, 1000); // Assign the interval to the startTimer variable.
}
function pauseWatch() {
clearInterval(startTimer); // Use the startTimer variable to clear the interval.
}
In the code provided, I declared the startTimer variable outside of the functions to make it accessible to both the startWatch and pauseWatch functions. This way, the clearInterval function can properly clear the interval when pauseWatch is called.
英文:
const startBtn = document.querySelector('.startBtn');
const pauseBtn = document.querySelector('.pauseBtn');
const ResetBtn = document.querySelector('.resetBtn');
const time = document.querySelector('.time');
let seconds = 0;
let secondsStr = '00';
let minutes = 0;
let minutesStr = '00';
let hours = 0;
let hoursStr = '00';
let timeText = `${hoursStr}:${minutesStr}:${secondsStr}`;
time.textContent = timeText;
function addSecond() {
seconds++;
secondsStr = seconds.toString();
if (seconds < 10) {
secondsStr = `0${secondsStr}`;
}
if(seconds >= 60) {
seconds = 0;
minutes++;
minutesStr = minutes.toString();
if (minutes < 10) {
minutesStr = `0${minutesStr}`;
}
if(minutes >= 60) {
minutes = 0;
hours++;
hoursStr = hours.toString();
if (hours < 10) {
hoursStr = `0${hoursStr}`;
}
}
}
timeText = `${hoursStr}:${minutesStr}:${secondsStr}`;
time.textContent = timeText;
}
startBtn.addEventListener('click', startWatch);
pauseBtn.addEventListener('click', pauseWatch);
function startWatch() {
const startTimer = setInterval(addSecond, 1000);
}
function pauseWatch() {
clearInterval(startTimer);
}
<div class="stopwatch">
<div class="time"></div>
<div class="stopwatchBtns">
<button class="startBtn stopwatchBtn">Start</button>
<button class="pauseBtn stopwatchBtn">Pause</button>
<button class="resetBtn stopwatchBtn">Reset</button>
</div>
</div>
basically when the pauseWatch function is called i want it to clear the startTimer interval but it says that it is not defined even though it is im not sure if its to do with the variable scope but even if it is i dont know how to fix it
i tried rearranging some code but nothing seem to help at all
答案1
得分: 1
你需要在全局范围内（函数外部）定义startTimer变量。这样可以使它在你的startWatch()函数外部使用。
const startBtn = document.querySelector('.startBtn');
const pauseBtn = document.querySelector('.pauseBtn');
const ResetBtn = document.querySelector('.resetBtn');
const time = document.querySelector('.time');
let seconds = 0;
let secondsStr = '00';
let minutes = 0;
let minutesStr = '00';
let hours = 0;
let hoursStr = '00';
let timeText = `${hoursStr}:${minutesStr}:${secondsStr}`;
time.textContent = timeText;
let startTimer; // 在全局范围内定义变量
function addSecond() {
...
英文:
You need to define the startTimer variable in the global scope (outside of the function). This will allow it to be used outside of your startWatch() function.
const startBtn = document.querySelector('.startBtn');
const pauseBtn = document.querySelector('.pauseBtn');
const ResetBtn = document.querySelector('.resetBtn');
const time = document.querySelector('.time');
let seconds = 0;
let secondsStr = '00';
let minutes = 0;
let minutesStr = '00';
let hours = 0;
let hoursStr = '00';
let timeText = `${hoursStr}:${minutesStr}:${secondsStr}`;
time.textContent = timeText;
let startTimer; // define variable in global scope
function addSecond() {
...
答案2
得分: 0
StartTimer位于一个函数内，无法调用。我在代码开头添加了var startTimer;并稍微编辑了函数startWatch()
var startTimer;
function startWatch() {
startTimer = setInterval(addSecond, 1000);
}
请尝试访问：
https://replit.com/@JLRR222/problem#index.html
英文:
The StartTimer is inside a function, where it cannot be called.
I added var startTimer; at the beginning of the code and i edited the function startWatch() a bit
var startTimer;
function startWatch() {
startTimer = setInterval(addSecond, 1000);
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论