@sunnyrio

Как добавлять элементу класс в зависимости от нажатой кнопки?

Есть 4 кнопки с классом btn и у каждой кнопки свой id, также есть отдельно input с id="wtch_name".
Нужно, чтобы при клике на какую-либо из кнопок этому input'у подставлялся class в зависимости от id кнопки.
  • Вопрос задан
  • 156 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
const input = document.querySelector('input');
const buttons = document.querySelectorAll('button');
buttons.forEach(n => n.addEventListener('click', onClick));

Можно сложить в массив информацию о том, какой класс какому id соответствует:

const classes = [
  [ 'id1', 'class1' ],
  [ 'id2', 'class2' ],
  [ 'id3', 'class3' ],
];

function onClick() {
  classes.forEach(n => input.classList.toggle(n[1], n[0] === this.id));
}

Или добавить кнопкам атрибут, который будет содержать имя класса (id кнопкам в этом случае уже не нужны):

<button data-class="class1">click me</button>
<button data-class="class2">click me</button>
<button data-class="class3">click me</button>

function onClick() {
  buttons.forEach(n => input.classList.toggle(n.dataset.class, n === this));
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы