@Eldenhard

Как сделать перенос каждого выбранного значения в js?

Всем привет! Как можно сделать, чтобы значения которые выбрал пользователь отображались друг под другом возле поля "Вы выбрали:". В данный момент они все выводятся в 1 строку. "
" не помогает
<figure>
        <pre>
  <div class="Prokrutka">
    <label class="box-label"><input type="checkbox" id="op1" onchange="Options()" data-num="Сборный груз"> Сборный груз</label><br>
    <label class="box-label"><input type="checkbox" id="op2" onchange="Options()" data-num="Негабаритный груз"> Негабаритный груз</label><br>
    <label class="box-label"><input type="checkbox" id="op3" onchange="Options()" data-num="Контейнерные перевозки"> Контейнерные перевозки</label><br>
    <label class="box-label"><input type="checkbox" id="op4" onchange="Options()" data-num="Опасные грузы"> Опасные грузы</label><br>
    <label class="box-label"><input type="checkbox" id="op5" onchange="Options()" data-num="Перевозка фурой"> Перевозка фурой</label><br>
    <label class="box-label"><input type="checkbox" id="op6" onchange="Options()" data-num="Междугородние переезды"> Междугородние переезды</label><br>
    <label class="box-label"><input type="checkbox" id="op7" onchange="Options()" data-num="Экспресс-доставка"> Экспресс-доставка</label><br>
    <label class="box-label"><input type="checkbox" id="op8" onchange="Options()" data-num="Авиаперевозка"> Авиаперевозка</label><br>
  </div>
  <button id="CompleteButtonOption" onclick="Complete()">Подтвердить</button>
</pre>
</figure>
<p id="outOptions">Вы выбрали:</p>


let checked = [];

document.querySelectorAll('input[type="checkbox"]').forEach(elem => {
  elem.addEventListener('click', ev => {
    const num = ev.target.dataset.num;
    if (checked.includes(num)) {
      const indexOfNum = checked.indexOf(num);
      if (indexOfNum > -1) {
        checked.splice(indexOfNum, 1);
      }
    } else {
      checked.push(num);
    }

    const p = document.querySelector('p');
    p.textContent = `Вы выбрали:  ${checked.join(',')}`;
  });
});
  • Вопрос задан
  • 155 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы