oninput इवेंट
परिभाषा और उपयोग
oninput इवेंट एलीमेंट को उपयोगकर्ता इनपुट देते हुए होता है。
जब <input> या <textarea> एलीमेंट की वैल्यू बदली जाती है तो इस इवेंट का आयोजन होता है。
सूचनाःयह इवेंट इसी के समान है onchange इवेंट। अलग बात यह है कि oninput इवेंट एलीमेंट की वैल्यू बदलने के बाद तुरंत होता है, जबकि onchange इवेंट एलीमेंट फोकस खोता है और सामग्री बदलता है के बाद होता है। एक और अंतर यह है कि onchange इवेंट एलीमेंट <select> के लिए भी लागू होता है।
उदाहरण
उदाहरण 1
जब उपयोगकर्ता <input> फील्ड में सामग्री लिखता है तो जेस्क्रिप्ट चलाया जाता है:
<input type="text" oninput="myFunction()">
उदाहरण 2
एक्सट्रीम रेंज स्लाइडर - कैसे स्लाइडर की वैल्यू को गतिशील रूप से अद्यतन करें:
<input type="range" oninput="myFunction(this.value)">
व्याकरण
एचटीएमएल में:
<एलीमेंट oninput="myScript">
जेस्क्रिप्ट में:
ऑब्जेक्ट.oninput = function(){myScript};
जेस्क्रिप्ट में, addEventListener() विधि का उपयोग करके:
ऑब्जेक्ट.addEventListener("input", myScript);
टिप्पणीःइंटरनेट एक्सप्लोरर 8 या उससे पहले की संस्करण इसे नहीं समर्थित करती addEventListener() विधि。
तकनीकी विवरण
| बबलिंग: | सापोर्ट |
|---|---|
| वापस ले सकने वाला: | असमर्थित |
| इवेंट क़िस्मः | इवेंट, InputEvent |
| समर्थित एचटीएमएल टैगः | <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"> और <textarea> |
| डॉम संस्करणः | स्तर 3 इवेंट |
ब्राउज़र समर्थन
तालिका में इवेंट के पूर्ण समर्थन वाली पहली ब्राउज़र संस्करण के नंबर दर्शाया गया है。
| इवेंट | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| oninput | सापोर्ट | 9.0 | 4.0 | 5.0 | सापोर्ट |
