oninput olayı

Tanım ve Kullanım

oninput olayı element kullanıcı girdisi aldığında gerçekleşir.

<input> veya <textarea> elementlerinin değeri değiştiğinde bu olay gerçekleşir.

İpucu:Bu olay benzerdir onchange olayı. Farklılık, oninput olayının element değeri değiştikten sonra hemen gerçekleşmesi, onchange olayının element odak kaybettiği ve içerik değiştiği zaman gerçekleşmesidir. Bir diğer fark da onchange olayının <select> elementleri için de geçerli olmasıdır.

Örnek

Örnek 1

<input> alanında kullanıcı içerik yazarken JavaScript çalıştırılır:

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

Kişisel olarak deneyin

Örnek 2

Aralık kaydırıcı - Kaydırıcı değeri nasıl dinamik olarak güncellenir:

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

Kişisel olarak deneyin

Gramer

HTML'de:

<element oninput="myScript">

Kişisel olarak deneyin

JavaScript'te:

nesne.oninput = function(){myScript};

Kişisel olarak deneyin

JavaScript'te addEventListener() metodu kullanarak:

nesne.addEventListener("input", myScript);

Kişisel olarak deneyin

Açıklama:Internet Explorer 8 veya daha eski sürümler desteklenmiyor addEventListener() metodu.

Teknik ayrıntılar

Balonlama: Destek
İptal edilebilir: Desteklenmiyor
Olay türleri: Event, InputEvent
Desteklenen HTML etiketleri: <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"> ve <textarea>
DOM sürümü: 3. düzey olaylar

Tarayıcı desteği

Tabloda belirtilen rakamlar, bu olayı tamamen destekleyen ilk tarayıcı sürümünü gösterir.

Olaylar Chrome IE Firefox Safari Opera
oninput Destek 9.0 4.0 5.0 Destek