Peristiwa oninput

DOM Events InputEvent

Definisi dan Penggunaan

Peristiwa oninput terjadi ketika elemen menerima input pengguna.

Peristiwa ini terjadi ketika nilai elemen <input> atau <textarea> berubah.

Petunjuk:Peristiwa ini mirip dengan Peristiwa onchange。Perbezaannya adalah peristiwa oninput terjadi segera setelah nilai elemen berubah, sementara onchange terjadi ketika elemen kehilangan fokus dan konten berubah. Perbezaan lain adalah peristiwa onchange juga berlaku untuk elemen <select>.

Contoh

Contoh 1

Ketika pengguna menulis konten di field <input>, eksekusi JavaScript:

<input type="text" oninput="myFunction()">

Coba Sendiri

Contoh 2

Slider Skala - Bagaimana memperbarui nilai slider secara dinamis:

<input type="range" oninput="myFunction(this.value)">

Coba Sendiri

Sintaks

Pada HTML:

<elemen oninput="myScript">

Coba Sendiri

Pada JavaScript:

objek.oninput = function(){myScript};

Coba Sendiri

Pada JavaScript, gunakan metode addEventListener():

objek.addEventListener("input", myScript);

Coba Sendiri

Keterangan:Internet Explorer 8 atau versi yang lebih awal tidak mendukung Metode addEventListener()。

Detil Teknik

Bubbling: Support
Boleh Dikanseli: Tidak Dukung
Jenis Event: Event, InputEvent
Tag HTML yang Dukung: <input type="color">, <input type="date">, <input type="datetime">, <input type="email">, <input type="month">, <input type="number">, <input type="password">, <input type="range">, <input type="search">, <input type="tel">, <input type="text">, <input type="time">, <input type="url">, <input type="week"> serta <textarea>
DOM Versi: Level 3 Events

Browser Support

The numbers in the table indicate the first browser version that fully supports the event.

Events Chrome IE Firefox Safari Opera
oninput Support 9.0 4.0 5.0 Support
DOM Events InputEvent