Не надо стесняться решение

Курсы Знакомство с событиями
1

Немного не по курсу, но лучше тренироваться сразу на более современных вещах?

let popup=document.getElementsByClassName(“popup”);
//находим попап по имени класса

let show=document.getElementsByClassName(“button-show”);
//находим кнопку “Показать подробности”
show[0].addEventListener(“click”,function(evt){
evt.preventDefault();
popup[0].classList.add(“popup–open”);
})
//вешаем на эту кнопку обработчик событий добавляющий класс по клику+отменяем событие по умолчанию

let hide=popup[0].getElementsByClassName(“button-hide”);
hide[0].addEventListener(“click”,function(){
popup[0].classList.remove(“popup–open”);
})
//находим крестик и вешаем на него обработчик, удаляющий класс по клику

document.addEventListener(“keydown”,function(evt){
if(evt.keyCode===27){
popup[0].classList.remove(“popup–open”);
}
})
//вешаем на документ обработчик, отслеживающий нажатие “ESC”

2

// Можно сделать вот так
// Если элементы одни в своем классе, лучше сделать так в комментариях.

// const pupup = document.querySelector(".popup"),
// showBtn = document.querySelector(".button-show"),
// hideBtn = document.querySelector(".button-hide")

const popup = document.querySelectorAll(".popup"),
showBtn = document.querySelectorAll(".button-show"),
hideBtn = document.querySelectorAll(".button-hide")

// Вешаем события
showBtn[0].addEventListener(“click”, show)
// showBtn.addEventListener(“click”, show)

hideBtn[0].addEventListener(“click”, hide)
// hideBtn.addEventListener(“click”, hide)

document.addEventListener(“keydown”, (ev) => {
// if (ev.keyCode === 27 && popup.classList.contains(“popup-open”) ) popup.classList.remove(“popup-open”)
if ( ev.keyCode === 27 && popup[0].classList.contains(“popup-open”) ) popup[0].classList.remove(“popup-open”)
})

function show(ev) {
ev.preventDefault()
// popup.classList.add(“popup-open”)
popup[0].classList.add(“popup-open”)
}

function hide() {
// popup.classList.remove(“popup-open”)
popup[0].classList.remove(“popup-open”)
}

3

Третий тест не проходит у скрипта проверки.
Не проходила проверка на нажатую клавишу. evt.keyCode, evt.key, evt.code - результат не дали.
Локальная проверка - popup закрывается при нажатии на клавишу ‘Escape’. Если проверку убирать и закрывать popup любой клавишей, то третий тест проходит, но 4 естественно нет.
При смене браузера с Chrome (Версия 64.0.3282.167 ) на Firefox( Версия 70.0b8) , все тесты дали положительный результат.
Предположение что-то со скриптом проверки при работе в хроме.
:slight_smile: Идем дальше.

4

Пришлите, пожалуйста, код вашего решения.

5

Этот код работает, но не проходит второй тест. Опять что-то с интерпретатором

var popup = document.querySelector(’.popup’)
var button = document.querySelector(’.button-show’)
var buttonc = document.querySelector(’.button-hide’)
button.addEventListener(‘click’,function(e){
e.preventDefault()
popup.classList.add(‘popup–open’)
})
buttonc.addEventListener(‘click’,clothing)
document.addEventListener(‘keydown’,function(e){
if(e.keyCode===27){
clothing()
}
})
var clothing = function(){
popup.classList.remove(‘popup–open’)
}