3

Доброго времени суток. Столкнулся с такой проблемой. У меня есть input поле с datalist списком. Мне необходимо, что бы при нажатии на элемент из datalist, происходило какое-либо событие. Тот же alert, хотя бы. $().change работает, когда поле выходит из фокуса, а нужно, что бы сразу при нажатии. Такое возможно?

<input type="text" id="test_input" list="temp_list">
    <datalist id="temp_list">
        <option value="1">
            first
        </option>
        <option value="2">
            second
        </option>
        <option value="3">
            third
        </option>
    </datalist>
2
  • 1
    click?
    – hindmost
    6 мар 2017 в 10:08
  • Пробовал повесить всевозможные обработчики событий на datalist и на option. И ни один из них не сработал( .click в то числе. Если на input поставить click, то он вызывается когда нажимаешь непосредственно на input поле, а datalist отображается ниже и поэтому click с input не работает( 7 мар 2017 в 11:19

1 ответ 1

4

Событие input срабатывает тут же при изменении значения текстового элемента и поддерживается всеми браузерами, кроме IE8-.

$('#test_input').on('input', function() {
  console.log($(this).val());
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test_input" list="temp_list">
<datalist id="temp_list">
        <option value="1">
            first
        </option>
        <option value="2">
            second
        </option>
        <option value="3">
            third
        </option>
    </datalist>

1
  • Спасибо. А другого варианта нет? Просто у меня в программе, при заполнении этого поля выполняется ajax-запрос. И с .on('input') при любом нажатии на клавиатуру выполняется этот запрос. Если есть вариант, что бы лишь при нажатии на элемент из списка, я был бы очень благодарен. Ибо сам я не смог найти, как это сделать и знаний не хватает( 7 мар 2017 в 11:17

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.