Почему при выборе первого пункта option не срабатывает функция on change?

Рейтинг: -1Ответов: 1Опубликовано: 10.01.2023

Почему при выборе первого пункта option не срабатывает функция on change? Как сделать, чтобы при повторном выборе первого пункта функция все-равно срабатывала?

$(document).on( "change", 'select', function() {
        var value = $(this).val();
    $('.result').append('<b>'+value+'</b>');
});
select {
  width: 260px;
}

.result {
  display: flex;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<select>
  <option value="Выбор 1">Выбор 1</option>
  <option value="Выбор 2">Выбор 2</option>
  <option value="Выбор 3">Выбор 3</option>
  <option value="Выбор 4">Выбор 4</option>
</select>

<div class="result"></div>

Ответы

▲ 2Принят

Почему при выборе первого пункта option не срабатывает функция on change?

Оно срабатывает только при изменении значения.

Вот таким образом можно эмулировать выбор. Или добавить пустой option... Тогда все будет работать и так.

$(document).on("change", 'select', test);
$('select').each((_, o) => {
  console.log(o)
  test.call(o)
})

function test() {
  var value = $(this).val();
  $('.result').append('<b>' + value + '</b>');
}
select {
  width: 260px;
}

.result {
  display: flex;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<select>
  <option value="Выбор 1">Выбор 1</option>
  <option value="Выбор 2">Выбор 2</option>
  <option value="Выбор 3">Выбор 3</option>
  <option value="Выбор 4">Выбор 4</option>
</select>

<div class="result"></div>