Вы можете привязать событие ввода к текстовому полю input используя метод on(), чтобы обнаруживать любые изменения в нем.

В следующем примере будет отображаться введенное значение, когда вы вводите что-то в поле ввода.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Detect Change in Input Field</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
    $("#myInput").on("input", function(){
        // Распечатаем введенное значение в поле div
        $("#result").text($(this).val());
    });
});
</script>
</head>
<body>
    <p><input type="text" placeholder="Type something..." id="myInput"></p>
    <div id="result"></div>
</body>
</html>

Обратите внимание, что событие input запускается при вводе с клавиатуры, перетаскивании мышью, автозаполнении и даже копировании и вставке. Но он не сработает, если вы вставите ту же строку или выберите и повторно введите один и тот же символ и т. д.

Кроме того, если вы используете здесь событие change, оно не будет работать должным образом, поскольку в случае ввода текста событие change срабатывает только тогда, когда элемент теряет фокус (т.е. onblur). Попробуйте приведенный выше пример, заменив строку input на change (строка № 8), и посмотрите, как это работает.

Читайте также

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.