Jaka jest różnica między zdarzeniem "zmiana" i "wejście" dla elementu INPUT

Czy ktoś może mi powiedzieć, jaka jest różnica między zdarzeniami change i input?Jaka jest różnica między zdarzeniem "zmiana" i "wejście" dla elementu INPUT

używam jQuery do dodawania ich:

$('input[type="text"]').on('change', function() { 
    alert($(this).val()); 
})

Działa również z input zamiast change.

Może jakieś różnice w porządku zdarzeń w stosunku do ostrości?

Źródło

2013-06-11 Gabriel Petrovay

http://rakshasingh.weebly.com/1/post/2012/12/what-is-the- Różnica między wpisami on-on-a-on-change-in-javascript.html Uwaga: funkcja oninput nie jest obsługiwana w starszej przeglądarce. Możesz użyć wtedy: onchange, onpaste i onkeyup jako obejście. PS: zdarzenie oninput jest również błędne w IE9 i nie jest uruchamiane podczas usuwania. –

wejście uruchamia się częściej, np. Po naciśnięciu klawisza, podczas gdy zmiana w zasadzie odpala, gdy wejście jest rozmyte, a wartość nie jest tym, co było, gdy wejście było skupione. – dandavis

Zdarzenie 'input' również przechwytuje wklejanie. Zobacz http://stackoverflow.com/questions/15727324/for-a-javascript-autocomplete-search-box-must-we-use-the-input-event-handler – Antony

Według this post:

oninput zdarzenie występuje, gdy zawartość tekstu elementu zmienia się za pomocą interfejsu użytkownika.
onchange występuje, gdy selekcja, sprawdzany stan lub zawartość elementu zmieniły. W niektórych przypadkach występuje tylko wtedy, gdy element traci ostrość. Atrybut onchange może być używany z: <input>, <select> i <textarea>.

TL; DR:

oninput: wszelkie zmiany dokonane w treści tekstu
onchange:
- Jeśli jest to <input />: zmiana + tracą ostrość
- Jeśli jest to <select>: Zmień opcję

$("input, select").on("input", function() { 
 
    $("pre").prepend("\nOn input. | " + this.tagName); 
 
}).on("change", function() { 
 
    $("pre").prepend("\nOn change | " + this.tagName); 
 
}).on("focus", function() { 
 
    $("pre").prepend("\nOn focus | " + this.tagName); 
 
}).on("blur", function() { 
 
    $("pre").prepend("\nOn blur | " + this.tagName); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" /> 
 
<select> 
 
    <option>Alice</option> 
 
    <option>Bob</option> 
 
    <option>Carol</option> 
 
    <option>Dave</option> 
 
    <option>Emma</option> 
 
</select> 
 
<pre></pre>

Źródło

2013-06-11 15:12:02

Nadal nie mam pewności co do różnicy między tymi dwoma. Brzmią bardzo podobnie w twoich opisach. –

@ JustinMorgan Podobnie jak w przykładzie JSFiddle, 'onchange' występuje" gdy element traci fokus ", podczas gdy' oninput' pojawia się przy każdej zmianie tekstu. –

Różnica polega na tym, że zdarzenie oninput pojawia się natychmiast po zmianie wartości elementu, a zmiana pojawia się, gdy element traci fokus, po zmianie treści. – NinoLopezWeb

W changeevent pożary w większości przeglądarek, gdy zawartość jest zmieniana i element traci focus zasadniczo agregatem zmian. Nie zobaczysz tego zwolnionego za każdy zmieniony w przeciwieństwie do inputevent.
Urządzenie inputevent uruchamia się synchronicznie podczas zmiany zawartości elementu . Tak więc zdarzenie to będzie występować częściej. Obsługa przeglądarki różni się.

Źródło

2013-06-11 15:11:16 Gabe

Nie sądzę, że zdarzenie wejściowe ma gwarantowane uruchamianie synchroniczne. –

Również obecne wersje wszystkich przeglądarek obsługują zdarzenie 'input'. –

@TimDown, dlatego powiedziałem, że obsługa przeglądarki jest różna. Nie wszyscy mają aktualną wersję każdej przeglądarki. – Gabe

Jaka jest różnica między zdarzeniem "zmiana" i "wejście" dla elementu INPUT

Odpowiedz

Powiązane problemy