Apa perbedaan antara atribut onBlur dan onChange di HTML?

117

Kapan yang satu dipanggil versus yang lain? Apakah ada situasi di mana onChange akan dipanggil tetapi onBlur tidak akan dipanggil?

html

— pacman
sumber

171

The onBlurevent dipecat ketika Anda sudah pindah dari suatu objek tanpa harus memiliki berubah nilainya.

The onChangeevent hanya disebut ketika Anda telah mengubah nilai dari lapangan dan kehilangan fokus.

Anda mungkin ingin melihat pengantar quirksmode ke acara . Ini adalah tempat yang tepat untuk mendapatkan info tentang apa yang terjadi di browser Anda saat Anda berinteraksi dengannya. Bukunya juga bagus.

— Mark Dickinson
sumber

2

link Anda tentang quirksmode tidak berbicara tentang blur, hanya peristiwa dasar

— stackdave

23

onblur menyala saat bidang kehilangan fokus, sedangkan onchange menyala saat nilai bidang itu berubah. Namun, peristiwa ini tidak selalu terjadi dalam urutan yang sama.

Di Firefox, keluar dari kolom yang diubah akan mengaktifkan onchange lalu onblur, dan biasanya akan melakukan hal yang sama di IE. Namun, jika Anda menekan tombol enter, bukan tab, di Firefox akan menyala secara kabur lalu onchange, sedangkan IE biasanya akan menyala dalam urutan aslinya. Namun, saya telah melihat kasus di mana IE juga akan menembakkan blur terlebih dahulu, jadi berhati-hatilah. Anda tidak dapat berasumsi bahwa onblur atau onchange akan terjadi sebelum yang lain.

10

Contoh untuk membuat sesuatu menjadi konkret. Jika Anda memiliki pilihan demikian:

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

yang onblur()dipanggil saat Anda menavigasi pergi. The onchange()disebut ketika Anda memilih opsi yang berbeda dari seleksi - yaitu Anda mengubah apa itu yang sedang dipilih sebagai.

— Brian Agnew
sumber

1

Contoh lain: dalam input jenis number, mengklik panah atas / bawah akan mengaktifkan peristiwa perubahan (tetapi bukan peristiwa buram), sedangkan mengetik hanya menyebabkan peristiwa perubahan ketika bidang kehilangan fokus.

— Chris Middleton

7

Di Firefox, onchange hanya menyala ketika Anda menekan tab atau mengklik di luar kolom input. Hal yang sama berlaku untuk Onblur. Perbedaannya adalah onblur akan aktif baik Anda mengubah apa pun di lapangan atau tidak. Ada kemungkinan bahwa ENTER akan mengaktifkan salah satu atau keduanya, tetapi Anda tidak akan tahu bahwa jika Anda menonaktifkan ENTER di formulir Anda untuk mencegah pengiriman yang tidak terduga.

— Betty Mock
sumber

4

onBlur adalah saat fokus Anda tidak lagi pada bidang yang dipermasalahkan.

Properti onblur mengembalikan kode penanganan kejadian onBlur, jika ada, yang ada pada elemen saat ini.

onChange adalah saat nilai bidang berubah.

— Ólafur Waage
sumber

4

Saya pikir penting untuk dicatat di sini bahwa onBlur () tetap aktif.

Ini adalah utas yang bermanfaat tetapi satu-satunya hal yang tidak diklarifikasi adalah bahwa onBlur () akan diaktifkan setiap saat.

onChange () hanya akan aktif ketika nilainya diubah.

— php-b-grader
sumber

3

onChange adalah ketika sesuatu di dalam kolom berubah, misalnya, Anda menulis sesuatu di input teks.

onBlur adalah saat Anda mengalihkan fokus dari suatu bidang misalnya, Anda menulis di input teks dan Anda telah mengkliknya.

Jadi sebenarnya mereka hampir sama tetapi agar onChange berperilaku seperti cara onBlur melakukan sesuatu dalam masukan itu perlu diubah.

— Sam152
sumber