如何仅在键入第一个字符输入时启动函数?在JavaScript中

Question

我在youtube上看到了一个关于如何制作快速打字游戏的教程，它运行良好，但一旦加载页面/或呈现新的引号，计时器就会开始计数。我想添加一个新函数，使计时器只在键入第一个字符时启动，我可以使用.innerText=0使其保持在0，但我无法在键入字符时启动它，我创建的函数有什么问题？(renderNewQuote和startTimer函数运行良好，只需要让我创建的这个resetTimer函数运行即可(

function resetTimer() {
timerElement.innerText = 0
quoteInputElement.addEventListener('onkeydown', () => {
onkeydown.startTimer()
})
}

编辑：这是原始代码的一部分，我想在这里实现我上面说的功能：

async function renderNewQuote() {
const quote = await getRandomQuote()
quoteDisplayElement.innerHTML = ''
quote.split('').forEach(character => {
const characterSpan = document.createElement('span')
characterSpan.innerText = character
quoteDisplayElement.appendChild(characterSpan)
})
quoteInputElement.value = null
resetTimer() // Here was the startTimer() function, where I changed to the one that I created
}
function resetTimer() {
timerElement.innerText = 0
quoteInputElement.addEventListener('input', () => {
onkeydown.startTimer()
})
}
let startTime
function startTimer() {
timerElement.innerText = 0
startTime = new Date()
setInterval(() => {
timer.innerText = getTimerTime()
}, 1000)
}

Answer 1

在您的resetTimer((函数中，例如执行以下操作：

function resetTimer() {
timerElement.innerText = 0
quoteInputElement.addEventListener('input', (event) => {
if(event.target.value.length===1) startTimer()
})
}

以前的解决方案由于缺少条件而一直不起作用。因此，startTimer((函数从数字0开始被反复调用。

Answer 2

Javascript有一个很棒的事件监听器，名为input

function resetTimer() {
timerElement.innerText = 0
quoteInputElement.addEventListener('input', () => {
startTimer()
})
}