При використанні jquery .changeдля inputподії буде запущено лише тоді, коли вхід втратить фокус
У моєму випадку мені потрібно зателефонувати в службу (перевірити, чи значення дійсне), як тільки змінено вхідне значення. Як я міг це досягти?
При використанні jquery .changeдля inputподії буде запущено лише тоді, коли вхід втратить фокус
У моєму випадку мені потрібно зателефонувати в службу (перевірити, чи значення дійсне), як тільки змінено вхідне значення. Як я міг це досягти?
Відповіді:
ОНОВЛЕНО для уточнення та прикладу
приклади: http://jsfiddle.net/pxfunc/5kpeJ/
Метод 1. inputподія
У сучасних браузерах використовують inputподію. Ця подія запуститься, коли користувач набирає текстове поле, вставляє, скасовує, в основному будь-коли, коли значення змінюється з одного значення на інше.
У jQuery зроби це так
$('#someInput').bind('input', function() {
$(this).val() // get the current value of the input field.
});
починаючи з jQuery 1.7, замініть bindна on:
$('#someInput').on('input', function() {
$(this).val() // get the current value of the input field.
});
Метод 2. keyupподія
Для старих браузерів використовується keyupподія (це запуститься, коли клавіша на клавіатурі буде випущена, ця подія може дати хибний позитивний результат, оскільки коли "w" відпущено, вхідне значення змінюється і keyupподія починається , але також коли Клавіша "shift" відпускається, якщо keyupподії запускаються, але змін не було внесено.). Також цей спосіб не спрацьовує, якщо користувач правою кнопкою миші натискає та вставляє з контекстного меню:
$('#someInput').keyup(function() {
$(this).val() // get the current value of the input field.
});
Спосіб 3. Таймер ( setIntervalабо setTimeout)
Щоб подолати обмеження, keyupви можете встановити таймер, щоб періодично перевіряти значення вводу, щоб визначити зміну значення. Ви можете використовувати setIntervalабо setTimeoutзробити цю перевірку таймера. Дивіться помічену відповідь на це питання SO: подія зміни текстового поля jQuery або перегляньте загадку для робочого прикладу з використанням focusта blurподій для запуску та зупинки таймера для конкретного поля введення.
innerTextабо valueатрибут (імітує введення користувача) викликає подія MutationObserver jsfiddle.net/pxfunc/ 04chgpws / 1 (див. Console.log для реєстрації подій MutationObserver). У вас є інший тестовий випадок, на який я можу подивитися?
Якщо у вас HTML5:
oninput (запускається лише тоді, коли зміна насправді відбувається, але робить це негайно)В іншому випадку вам потрібно перевірити всі ці події, які можуть вказувати на зміну значення вхідного елемента:
onchange onkeyup( ні, keydown або keypressоскільки значення вводу ще не матиме нового натискання клавіші)onpaste (коли підтримується)а може:
onmouseup (Я не впевнений у цьому)За допомогою HTML5 та без використання jQuery ви можете використовувати inputподію :
var input = document.querySelector('input');
input.addEventListener('input', function()
{
console.log('input changed to: ', input.value);
});
Це запускатиметься кожного разу, коли текст введення змінюється.
Підтримується в IE9 + та інших браузерах.
Спробуйте в прямому ефірі jsFiddle тут .
Як вже пропонували інші, рішення у вашому випадку полягає в обнюхуванні кількох подій .
Плагіни, які виконують цю роботу, часто слухають такі події:
$ введення . on ( 'змінити клавішу натискання клавіші mousedown click mouseup' , обробник );
Якщо ви думаєте , що може поміститися, ви можете додати focus, blurі інші події теж.
Я пропоную не перевищувати події для прослуховування, оскільки це завантажує в пам'ять браузера подальші процедури, що виконуються відповідно до поведінки користувача.
Увага: зауважте, що зміна значення вхідного елемента за допомогою JavaScript (наприклад, за допомогою .val()методу jQuery ) не призведе до жодної з вищевказаних подій.
(Довідка: https://api.jquery.com/change/ ).
.val()наприклад, для події зміни у полі введення, ви зробите щось подібне ... $('#element').val(whatever).change()
Якщо ви хочете, щоб подію було знято щоразу, коли щось змінено в межах елемента, ви можете використовувати подію клавіатури .
onchange, або самостійно відстежувати стан. keydownне працює, тому що він спрацьовує до зміни стану вводу.
// .blur спрацьовує, коли елемент втрачає фокус
$('#target').blur(function() {
alert($(this).val());
});
// Для запуску вручну використовуйте:
$('#target').blur();
Є такі події jQuery, як клавіатура та натискання клавіш, які можна використовувати для введення елементів HTML. Ви можете додатково використовувати подію blur () .
keypressподії, оскільки натиснута клавіша ще не змінила це значення.