W przypadku użycia jquery .change
na input
zdarzeniu zostanie uruchomione tylko wtedy, gdy wejście utraci fokus
W moim przypadku muszę zadzwonić do serwisu (sprawdzić, czy wartość jest poprawna), jak tylko zmieni się wartość wejściowa. Jak mogłem to osiągnąć?
javascript
jquery
html
Banshee
źródło
źródło
Odpowiedzi:
AKTUALIZACJA dla wyjaśnienia i przykładu
przykłady: http://jsfiddle.net/pxfunc/5kpeJ/
Metoda 1.
input
zdarzenieW nowoczesnych przeglądarkach wykorzystaj to
input
wydarzenie. To zdarzenie zostanie uruchomione, gdy użytkownik pisze w polu tekstowym, wkleja, cofa, w zasadzie za każdym razem, gdy wartość zmienia się z jednej wartości na drugą.W jQuery zrób to w ten sposób
wychodząc z jQuery 1,7, wymienić
bind
won
:Metoda 2.
keyup
zdarzenieW starszych przeglądarkach należy użyć
keyup
zdarzenia (będzie ono uruchamiane po zwolnieniu klawisza na klawiaturze, to zdarzenie może dać rodzaj fałszywie dodatniego, ponieważ po zwolnieniu „w” wartość wejściowa jest zmieniana ikeyup
zdarzenie jest uruchamiane, ale także gdy Klawisz „shift” jest zwolniony,keyup
zdarzenie jest uruchamiane, ale nie wprowadzono żadnych zmian w danych wejściowych.). Również ta metoda nie jest uruchamiana, jeśli użytkownik kliknie prawym przyciskiem myszy i wklei z menu kontekstowego:Metoda 3. Timer (
setInterval
lubsetTimeout
)Aby obejść ograniczenia
keyup
, możesz ustawić zegar, aby okresowo sprawdzał wartość wejścia w celu ustalenia zmiany wartości. Możesz użyćsetInterval
lub,setTimeout
aby wykonać to sprawdzenie timera. Zobacz zaznaczoną odpowiedź na to pytanie SO: zmiana zdarzenia w polu tekstowym jQuery lub zobacz skrzypce dla działającego przykładu użyciafocus
iblur
zdarzeń do uruchomienia i zatrzymania stopera dla określonego pola wejściowegoźródło
innerText
lubvalue
(symulowanie danych wejściowych użytkownika) wyzwoli zdarzenie MutationObserver jsfiddle.net/pxfunc/ 04chgpws / 1 (zobacz logowanie zdarzeń MutationObserver w pliku console.log). Czy masz inny przypadek testowy, na który mogę spojrzeć?Jeśli masz HTML5:
oninput
(odpala tylko wtedy, gdy zmiana faktycznie nastąpi, ale robi to natychmiast)W przeciwnym razie należy sprawdzić wszystkie te zdarzenia, które mogą wskazywać na zmianę wartości elementu wejściowego:
onchange
onkeyup
( niekeydown
lubkeypress
jako wartość wejściowa nie będzie jeszcze zawierać nowego naciśnięcia klawisza)onpaste
(gdy obsługiwane)I może:
onmouseup
(Nie jestem tego pewien)źródło
Dzięki HTML5 i bez użycia jQuery możesz użyć
input
zdarzenia :Będzie on uruchamiany przy każdej zmianie tekstu wejściowego.
Obsługiwane w IE9 + i innych przeglądarkach.
Wypróbuj na żywo w jsFiddle tutaj .
źródło
Jak już sugerowali inni, rozwiązaniem w twoim przypadku jest wąchanie wielu zdarzeń .
Wtyczki wykonujące tę pracę często nasłuchują następujących zdarzeń:
Jeśli uważasz, że może pasować, można dodać
focus
,blur
i inne imprezy też.Sugeruję, aby nie przekraczać liczby zdarzeń do nasłuchiwania, ponieważ ładuje do pamięci przeglądarki dalsze procedury do wykonania zgodnie z zachowaniem użytkownika.
Uwaga: pamiętaj, że zmiana wartości elementu wejściowego za pomocą JavaScript (np. Za pomocą
.val()
metody jQuery ) nie spowoduje uruchomienia żadnego z powyższych zdarzeń.(Odniesienie: https://api.jquery.com/change/ ).
źródło
.val()
np. Zdarzeniu zmiany w polu wejściowym, zrobiłbyś coś takiego ...$('#element').val(whatever).change()
Jeśli chcesz, aby zdarzenie było uruchamiane za każdym razem, gdy coś ulegnie zmianie w elemencie, możesz użyć zdarzenia kluczowania .
źródło
onchange
lub śledzić stan.keydown
nie działa, ponieważ jest uruchamiany przed zmianą stanu wejścia.// .blur jest wyzwalany, gdy element traci fokus
// Aby wyzwalać ręcznie, użyj:
źródło
Są to zdarzenia jQuery jak keyup i naciśnięciu klawisza , który można wykorzystać do wprowadzania elementów HTML. Możesz dodatkowo użyć zdarzenia blur () .
źródło
keypress
zdarzenia, ponieważ naciśnięty klawisz jeszcze nie zmieni tej wartości.Obejmuje to każdą zmianę danych wejściowych za pomocą jQuery 1.7 i nowszych:
źródło