@kamisarlapsha

Как получить текст выбранных пунктов меню?

Есть выпадающий список. Надо текст выбранных пунктов записывать в <span class="selected-name--filter"> , а если ничего не выбрано - записывать туда строку "Любой".
<div class="dropdown filter-select--block">
      <button class="filter-select" type="button" data-toggle="dropdown" aria-expanded="false">
        <span class="selected-name--filter">
        <!--Здесь текст кнопки-->
        </span>
      </button>
      <div class="select-list">
       <label> 
         <input class="ocf-target" autocomplete="off" />
         <!--имя значения-->
       </label>
       <label> 
         <input class="ocf-target" autocomplete="off" />
         <!--имя значения-->
       </label>
       <label> 
         <input checked="checked" class="ocf-target" autocomplete="off" />
         <!--имя значения-->
       </label>
      </div>
    </div>
  • Вопрос задан
  • 97 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
$('.select-list').change(function() {
  const selected = $(':checked', this)
    .parent()
    .get()
    .map(n => $(n).text().trim())
    .join(', ');

  $('.selected-name--filter').text(selected || 'Любой');
}).change();

или

const select = document.querySelector('.select-list');

select.addEventListener('change', function() {
  const selected = Array
    .from(this.querySelectorAll(':checked'), n => n.parentNode.textContent.trim())
    .join(', ');

  document.querySelector('.selected-name--filter').textContent = selected || 'Любой';
});

select.dispatchEvent(new Event('change'));
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Stalker_RED
@Stalker_RED
Ваш ответ на вопрос

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

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