Подсветить label при нажатии

72
01 ноября 2021, 00:30

Подскажите, есть несколько лейблов:

<label for="CoinVal_1">1</label>
<label for="CoinVal_2">2</label>
<label for="CoinVal_3">3</label>

Как сделать подчеркивание лейбла, на который был произведен клик, и подчеркнуть другой, если кликнули на другой лейбл, но не убирать подчеркивание, если клик был сделан по любому другому элементу на странице?

Answer 1

  let allLabel = document.querySelectorAll('label'); 
 
  allLabel.forEach(value => { 
    value.addEventListener('click', e => { 
      drop(); 
      e.target.classList.add('border'); 
    }); 
  }); 
 
  function drop(){ 
    allLabel.forEach(value => { 
      value.classList.remove('border') 
    }); 
  }
  .border { 
    border-bottom: 3px solid black; /* Параметры линии под текстом */ 
  }
  <label for="CoinVal_1" class="label">1</label> 
  <label for="CoinVal_2" class="label">2</label> 
  <label for="CoinVal_3" class="label">3</label>

READ ALSO
Переключение класса при клике

Переключение класса при клике

Есть такая структура:

77
Пытаюсь сделать &#39;Пятнашки&#39; столкнулся с проблемой

Пытаюсь сделать 'Пятнашки' столкнулся с проблемой

при нажатии на верхний ряд или нижний, выдает ошибку (Uncaught TypeError: Cannot read property '3' of undefined), и кубик не передвигается

103
Поиск в большом тексте

Поиск в большом тексте

Есть у меня большой текст и моя задача в том чтобы при вводе что-то в поле ввода программа начала искать совпадения с текстом и возвращала...

103