我正在尝试制作一个在按下 "a" 键时闪烁图像的程序

Question

<div class="planeta" id="planeta">
  <img src="planeta.jpg" style="width: 150px; height: 150px;">
  <div class="text-blocka">
    <h4>Kepler-186f</h4>
    <p>550 light years away</p>
  </div>
</div>

代码的第一部分有效，图像开始闪烁，但我希望它在释放键时取消闪烁，这部分对我不起作用。下面是我到目前为止写的javascript。提前致谢！

function checkKeydowna(akey) {
    if (akey.keyCode == "65") {
      var img = document.getElementById('planeta');

var interval = window.setInterval(function(){
    if(img.style.visibility == 'hidden'){
        img.style.visibility = 'visible';
    } else {
      img.style.visibility == 'hidden'
      }
}, 50);
    }
}

window.addEventListener("keyup", checkKeyupa, false);

function checkKeyupa(abkey) {
    if (abkey.keyCode == "65") {
    delete window.setInterval();
    }
  }

Answer 1

您需要将 checkKeyupa 放在 SetTimeout 或 setInterval 中。

window.addEventListener("keyup", ()=>setTimeout(checkKeyupa, 50), false);

因为您需要确保 checkKeyupa 在事件队列中进入时间间隔并在时间间隔执行后执行。

Answer 2

您忘记 addEventListener checkKeydowna。
delete window.setInterval(); 没有意义。那不清除间隔。你应该用 window.clearInterval(intervalInstance) 清除间隔。所以如果你想清除一个间隔，你应该在设置它时将它存储在一个全局变量中。这就是我声明 var interval = false; 的原因，这也意味着未设置间隔。
keydown事件会被多次触发，请检查是否设置了interval，避免重新初始化。

var interval = false;
function checkKeydowna(akey) {
  if (akey.keyCode == "65") {
    var img = document.getElementById('planeta');

    if (!interval) {
      interval = window.setInterval(function() {
        if (img.style.visibility == 'hidden') {
          img.style.visibility = 'visible';
        } else {
          img.style.visibility = 'hidden'
        }
      }, 50);
    }
  }
}

document.body.addEventListener("keyup", checkKeyupa, false);
document.body.addEventListener("keydown", checkKeydowna, false);

function checkKeyupa(abkey) {
  if (abkey.keyCode == "65") {
    window.clearInterval(interval);
    interval = false;
    var img = document.getElementById('planeta');
    img.style.visibility = 'visible';
  }
}

<img style='visibility:visible' src="https://www.google.com.tr/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" id="planeta" />

我正在尝试制作一个在按下 "a" 键时闪烁图像的程序

I'm trying to make a programme which flashes an image when the "a" key is pressed

javascript

keydown

keyup