Блог

Главная - Вопросы по программированию - Как я могу использовать событие keydown в операторе if / else

Как я могу использовать событие keydown в операторе if / else

#javascript

#javascript

Вопрос:

Я пытаюсь создать онлайн-лампочку для своего проекта научной ярмарки в средней школе, и я хочу добавить «пасхальное яйцо», где появляется предупреждение. Я пытаюсь заставить его активироваться при нажатии определенной клавиши. Это код, который у меня есть до сих пор:

HTML

 <!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <title>Light Bulb</title>
    <link href = "file.css" rel = "stylesheet">
  </head>
  <body>
    <button id = "light-switch">Turn on Light</button>
    <p id = "lightStatus">Light is off</p>
    <p id = "easterEgg"></p>
  </body>
  <script src="file.js"></script>
</html>

JS

 let swt = document.querySelector("#light-switch");
let sta = document.querySelector("#lightStatus");
let egg = document.querySelector("#easterEgg");
let html = document.querySelector("html");

swt.addEventListener("click", updateSwt);

function updateSwt() {
  if(swt.textContent === "Turn on Light"){
    swt.textContent = "Turn off Light";
    swt.style.backgroundColor = "Yellow";
    console.log("on");
    sta.textContent = "Light is on";
  }
  else{
    swt.textContent = "Turn on Light";
    swt.style.backgroundColor = "Black";
    console.log("off");
    sta.textContent = "Light is off";
  }
}

swt.addEventListener("click",updateConsole);

function updateConsole() {
  if(swt.click === true) {
    console.log("")
  }
  else{
    console.log("swtClick")
  }
}

Это то, что я пробовал

 swt.addEventListener("keydown", updateEgg);

function updateEgg() {
  if(html.keydown === true){
    console.log("easter egg found")
    alert("You found the easter egg!!!");
  }
  else{
    console.log("")
  }

Ответ №1:

Если я правильно вас понял, то то, к чему вы стремитесь, может быть достигнуто с помощью.

 html.addEventListener("keydown", updateEgg);

function updateEgg() {
   if (event.keyCode == 85 /*checks for u press*/) { 
     console.log("easter egg found")
     alert("You found the easter egg!!!");
   }
}

Оператор if проверяет, была ли нажата клавиша «u». Для кодов клавиш вы можете найти https://keycode.info / полезно.

Комментарии:

1. event.keyCode == 85 обесценивается. Используйте event.key === 'u' вместо этого.

Ответ №2:

Вот скрипка:

https://jsfiddle.net/6p7590or/1/

 html.addEventListener("keypress", updateEgg);

function updateEgg(e) {
  if(e.key === "u"){
    console.log("easter egg found")
    alert("You found the easter egg!!!");
  }
  else{
    console.log(e.key)
  }
  }