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

Question

[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>

Answer 1

[0xD34F]

$('.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'));

Comments

[kamisarlapsha]

Спасибо!

Answer 2

[Stalker_RED]

Возьми select2 или chosen.

Comments

[kamisarlapsha]

Если бы мог, то использовал бы select. Но это не получится, т.к. дальнейшии функции строятся на том, выделен ли чекбокс

[Stalker_RED]

kamisarlapsha, не вижу чекбокс.

[kamisarlapsha]

Stalker_RED, Извиняюсь, перпепутал, строится на checked у input