Блог

Главная - Вопросы по программированию - Функция обработки событий

Функция обработки событий

#javascript #event-handling

Вопрос:

В задании вам нужно изменить цвет фона блока на зеленый при нажатии клавиши G, но никаких изменений не происходит.

 <body>
<div id="colorOutput">
</div>

<script>
   let div = document.querySelector("#colorOutput");
   document.addEventListener("keydown", function (event) {
        if (event.code == "Enter") changeToGreen();
    })
   function changeToGreen() {
       div.style.backgroundСolor = "green";
   }
</script>

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

1. backgroundСolor <— Это С не C запуск этого в консоли console.log(escape("С"), escape("C"))

2. ваш div пуст, поэтому этот элемент не может обработать какое-либо событие клавиатуры

3. и в дополнение к обоим этим пунктам code свойство не будет равно "Enter" , если пользователь нажмет G!

4. @epascarello о, вау!! Как, черт возьми, ты это заметил??

5. @JeremyThille пошел редактировать вопрос и увидел обалденный C в редакторе

Ответ №1:

Попробуйте использовать приведенный ниже JS-код.

 const div = document.getElementById("colorOutput");
window.addEventListener("keydown", (e)=>{
    e.code === "Enter" ? changeToGreen() : null;
});
function changeToGreen() {
       alert("JAI HARI");
       div.style.backgroundСolor = "green";
   }

Используйте window вместо document для прослушивателя событий.

Метки: