Как перехватить значение option в datalist при выборе из списка?

Question

Как перехватить значение option в datalist при выборе из списка? например по нажатию на Tissot, перехватить не value, а текст Tissot?

$('#ajax_input').on('change', function(){     
  console.log($(this).val()) // показывает value значение      
  // как здесь перехватить текст, который был в нажатом option, например текст Tissot 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="ajax_input" list="device" autocomplete="off" name="device">
<datalist id="device">                   
  <option value="9">Tissot</option>
  <option value="7">Appella</option>
</datalist>

Answer 1

В комментарии Вам уже дали правильный ответ. Единственное, что можно сократить, это ссылку на <datalist> - при создании атрибута list, создаётся одноимённое свойство, которое и содержит указатель на список:

$('#ajax_input').on('change', function(){     
  console.log( $(this.list).find('option[value="'+$(this).val()+'"]').text() );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="ajax_input" list="device" autocomplete="off" name="device">
<datalist id="device">                   
  <option value="9">Tissot</option>
  <option value="7">Appella</option>
</datalist>

БЛОГ НА HUSL

Как перехватить значение option в datalist при выборе из списка?

Ответы (1 шт):