1

На странице есть много блоков одного размера, надо сделать так, чтобы при нажатии на блок, его название добавлялось в поле поиска input. Так как новичок, решил сделать из них чекбоксы (конечно, если можно сделать по другому, посоветуйте, пожалуйста, как именно). Нашел на просторах интернета некоторую информацию и сделал маленький пример

'use strict';
var items = document.querySelectorAll('[class="help"]');
var output = document.getElementById('output');
var links = Array.from(items).forEach(item => {
    if ($('input').is(':checked')) {
      output.innerHTML += `$ {
      item.name
    }
    </br>`;
    } else {
      output.innerHTML += ``;
    }
  }

);
<input type="checkbox" id="scales" class="help" name="scales" checked>
<label for="scales">Scales</label>
<input type="checkbox" id="horns" class="help" name="horns">
<label for="horns">Horns</label></br>
<div id='output'></div>

но работает он криво. Может кто занимался похожим и может помочь?

2
  • Что за гибрид из js и jq непонятный
    – Air
    Commented 27 апр. 2019 в 17:01
  • не сильно еще разбираюсь в js
    – dduckker
    Commented 27 апр. 2019 в 17:07

1 ответ 1

1

Вы про это?

[...document.querySelectorAll('.help')]
    .forEach(checkbox => checkbox.onchange = update)

update()

function update() {
  document.getElementById('output').value = 
    [...document.querySelectorAll('input:checked + label')]
        .map(label => label.textContent).join(' ');
}
<input type="checkbox" id="scales" class="help" checked>
<label for="scales">Scales</label>
<input type="checkbox" id="horns" class="help">
<label for="horns">Horns</label><br>
<input id='output'>

2
  • да, спасибо огромное!)
    – dduckker
    Commented 27 апр. 2019 в 19:10
  • @dduckker отлично, пожалуйста Commented 27 апр. 2019 в 19:10

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.