When the functions are called using LINK everything works smoothly:
function display() {
let time = new Date();
timer = setTimeout(function() {
document.getElementById('output').innerHTML = time.getSeconds() + '.' + time.getMilliseconds();
display();
}, 150);
}
function stopDisplay() {
clearTimeout(timer);
document.getElementById('output').innerHTML = 'all stopped!';
}
<input type="search" name="sin" onkeypress="display();" onkeyup="stopDisplay();this.value='';" />
<a href="" onclick="display();return false;">show</a> /
<a href="" onclick="stopDisplay();return false;">not show</a>
<div id="output"></div>
It also works fine if you press a key only once.
But when the user holds down a key, then things go wrong.
Why is that?