Показать сообщение отдельно
  #3 (permalink)  
Старый 15.10.2018, 12:01
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

AndriiS, посмотрите расширенный комментарий к пункту 3.

активация-деактивация кнопок без флагов....
<body>
<div class="container">
<button class="btn" data-action="add">Add Listener</button>
<button class="btn" data-action="remove" disabled>Remove Listener</button></div>
<hr>
<button id="btn" class="btn" disabled>CLICK ME!</button>

<script>
const addBtn = document.querySelector('button[data-action="add"]');
const removeBtn = document.querySelector('button[data-action="remove"]');
const btn = document.querySelector("#btn");

(2) // создаем функцию обработчик:
const handleClick = () => {
   alert("CLICK EVENT LISTENER ALERT!");
   addBtn.disabled = true;
   removeBtn.disabled = false;
   btn.disabled = false; 
};

(3) // назначаем обработчик для переменой addBtn по событию click, по которому назначается обработчик события click по кнопке btn
addBtn.addEventListener("click", () => {
   addBtn.disabled = true;
   removeBtn.disabled = false;
   btn.disabled = false; 
   btn.addEventListener("click", handleClick);
});

removeBtn.addEventListener("click", () => {
   addBtn.disabled = false;
   removeBtn.disabled = true;
   btn.disabled = true; 
   btn.removeEventListener("click", handleClick);
});
</script>
</body>
Ответить с цитированием