Was ist der Unterschied zwischen dem onBlur- und dem onChange-Attribut in HTML?

117

Wann heißt einer gegen den anderen? Gibt es eine Situation, in der onChange aufgerufen würde, onBlur jedoch nicht aufgerufen würde?

html Pacman
quelle

Antworten:

171

Das onBlurEreignis wird ausgelöst, wenn Sie sich von einem Objekt entfernt haben, ohne dessen Wert unbedingt geändert zu haben.

Das onChangeEreignis wird nur aufgerufen, wenn Sie den Wert des Felds geändert haben und es den Fokus verliert.

Vielleicht möchten Sie sich das Intro zu Ereignissen von quirksmode ansehen . Dies ist ein großartiger Ort, um Informationen darüber zu erhalten, was in Ihrem Browser vor sich geht, wenn Sie mit ihm interagieren. Sein Buch ist auch gut.

Mark Dickinson
quelle
2
Ihr Link über Quirksmode spricht nicht über Unschärfe,
sondern
23

onblur wird ausgelöst, wenn ein Feld den Fokus verliert, während onchange ausgelöst wird, wenn sich der Wert dieses Felds ändert. Diese Ereignisse treten jedoch nicht immer in derselben Reihenfolge auf.

In Firefox wird das Tippen aus einem geänderten Feld bei Änderung und dann bei Unschärfe ausgelöst, und im IE wird dies normalerweise auch getan. Wenn Sie jedoch die Eingabetaste anstelle der Tabulatortaste drücken, wird in Firefox "onblur" und dann "change" ausgelöst, während der IE normalerweise in der ursprünglichen Reihenfolge ausgelöst wird. Ich habe jedoch Fälle gesehen, in denen der IE zuerst auch Unschärfe auslöst. Seien Sie also vorsichtig. Sie können nicht davon ausgehen, dass entweder die Unschärfe oder die Änderung vor der anderen erfolgt.


quelle
10

Ein Beispiel, um Dinge konkret zu machen. Wenn Sie also eine Auswahl haben:

<select onchange="" onblur="">
  <option>....
</select>

Das onblur()wird aufgerufen, wenn Sie weg navigieren. Das onchange()wird aufgerufen, wenn Sie eine andere Option als die Auswahl auswählen - dh Sie ändern, was aktuell ausgewählt ist.

Brian Agnew
quelle
1
Ein weiteres Beispiel: numberWenn Sie in Eingaben vom Typ auf die Aufwärts- / Abwärtspfeile klicken, wird ein Änderungsereignis (aber kein Unschärfeereignis) ausgelöst, während die Eingabe nur dann ein Änderungsereignis verursacht, wenn das Feld den Fokus verliert.
Chris Middleton
7

In Firefox wird der Wechsel nur ausgelöst, wenn Sie auf die Registerkarte klicken oder außerhalb des Eingabefelds klicken. Gleiches gilt für Onblur. Der Unterschied besteht darin, dass Onblur ausgelöst wird, unabhängig davon, ob Sie etwas auf dem Feld geändert haben oder nicht. Es ist möglich, dass ENTER eine oder beide davon auslöst, aber Sie würden das nicht wissen, wenn Sie die ENTER in Ihren Formularen deaktivieren, um unerwartete Übermittlungen zu verhindern.

Betty Mock
quelle
4

onBlur ist, wenn Sie sich nicht mehr auf das betreffende Feld konzentrieren.

Die Eigenschaft onblur gibt den Ereignisbehandlungscode onBlur zurück, falls vorhanden, der für das aktuelle Element vorhanden ist.

onChange ist, wenn sich der Wert des Feldes ändert.

Ólafur Waage
quelle
4

Ich denke, es ist wichtig anzumerken, dass onBlur () trotzdem ausgelöst wird.

Dies ist ein hilfreicher Thread, aber das einzige, was nicht klargestellt wird, ist, dass onBlur () jedes Mal ausgelöst wird.

onChange () wird nur ausgelöst, wenn der Wert geändert wird.

PHP-B-Grader
quelle
3

onChange ist, wenn sich etwas in einem Feld ändert, z. B. wenn Sie etwas in eine Texteingabe schreiben.

onBlur ist, wenn Sie den Fokus von einem Feld wegnehmen, z. B. wenn Sie in eine Texteingabe geschrieben haben und darauf geklickt haben.

Eigentlich sind sie fast dasselbe, aber damit sich onChange so verhält, wie onBlur etwas in dieser Eingabe tut, muss sich etwas ändern.

Sam152
quelle