कोर्स सिफारिश:
onfocusout इवेंट
वर्णन और उपयोग
यद्यपि Firefox onfocusout इवेंट को समर्थित नहीं करता, आप onblur इवेंट के कैच लिस्टनर (addEventListener() विधि के वैकल्पिक useCapture पारामीटर) का उपयोग करके आयात कर सकते हैं कि एलिमेंट के उप-एलिमेंट फोकस खोते हैं या नहीं। onfocusout इवेंट जब एलिमेंट जल्दी ही फोकस खोता है तब होता है。 onblur घटनाonfocusout इवेंट जैसा है
यद्यपि Firefox onfocusout इवेंट को समर्थित नहीं करता, आप onblur इवेंट के कैच लिस्टनर (addEventListener() विधि के वैकल्पिक useCapture पारामीटर) का उपयोग करके आयात कर सकते हैं कि एलिमेंट के उप-एलिमेंट फोकस खोते हैं या नहीं।।मुख्य अंतर कि onblur इवेंट नहीं बुबल करता।इसलिए यदि आप एलिमेंट या उसके उप-एलिमेंट को फोकस खोने का पता लगाना चाहते हैं तो onfocusout इवेंट का उपयोग करें।
यद्यपि Firefox onfocusout इवेंट को समर्थित नहीं करता, आप onblur इवेंट के कैच लिस्टनर (addEventListener() विधि के वैकल्पिक useCapture पारामीटर) का उपयोग करके आयात कर सकते हैं कि एलिमेंट के उप-एलिमेंट फोकस खोते हैं या नहीं। सुझाव: onfocusin घटनाonfocusout इवेंट के साथ
विपरीत
उदाहरण
उदाहरण 1
जब इनपुट फील्ड जल्दी ही फोकस खोता है तब जेसक्रिप्ट चलाएं:
<input type="text" onfocusout="myFunction()">
पृष्ठ के नीचे अधिक TIY उदाहरण हैं。
व्याकरण
HTML में:< element.addEventListener("focusout",onfocusout="
">
जेसक्रिप्ट में, addEventListener() विधि का उपयोग करके:In JavaScript (Chrome, Safari और Opera 15+ में इसका अपेक्षित कामकाज नहीं कर सकता):.addEventListener("focusout",.onfocusout = function(){
};
जेसक्रिप्ट में, addEventListener() विधि का उपयोग करके:object .addEventListener("focusout",myScript
टिप्पणी:); Internet Explorer 8 या अधिक पुरानी संस्करण इसे समर्थित नहीं करतेaddEventListener() विधि
।
तकनीकी विवरण | समर्थन |
---|---|
बुबलिंग: | रद्द करने वाला: |
असमर्थित | FocusEvent |
समर्थित HTML टैग्स: | सभी HTML एलिमेंट्स, जिनको छोड़ दें: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> और <title> |
DOM संस्करण: | स्तर 2 इवेंट |
ब्राउज़र समर्थन
तालिका में दिए गए नंबर इस इवेंट को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र आउटपुट को इंगित करते हैं。
इवेंट | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
onfocusout | समर्थन | समर्थन | 52.0 | समर्थन | समर्थन |
टिप्पणी:onfocusout इवेंट Chrome, Safari और Opera 15+ में JavaScript HTML DOM व्याकरण का उपयोग करते हुए संभवतः अप्रत्याशित ढंग से काम नहीं कर सकता है। लेकिन, यह HTML एट्रिब्यूट के रूप में उपयोग किया जाना चाहिए और addEventListener() विधि का उपयोग किया जाना चाहिए (नीचे दिए गए व्याकरण उदाहरण को देखें)。
और अधिक उदाहरण
उदाहरण 2
"onfocusin" और "onfocusout" इवेंट को साथ में उपयोग करना:
<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
उदाहरण 3
इवेंट डेलीगेशन: addEventListener() के useCapture पैरामीट को true सेट करना (focus और blur के लिए):
<form id="myForm"> <input type="text" id="myInput"> </form> <script> var x = document.getElementById("myForm"); x.addEventListener("focus", myFocusFunction, true); x.addEventListener("blur", myBlurFunction, true); function myFocusFunction() { document.getElementById("myInput").style.backgroundColor = "yellow"; } function myBlurFunction() { document.getElementById("myInput").style.backgroundColor = ""; } </script>
उदाहरण 4
इवेंट डेलीगेशन: focusin इवेंट का उपयोग करने से
<form id="myForm"> <input type="text" id="myInput"> </form> <script> var x = document.getElementById("myForm"); x.addEventListener("focusin", myFocusFunction); x.addEventListener("focusout", myBlurFunction); function myFocusFunction() { document.getElementById("myInput").style.backgroundColor = "yellow"; } function myBlurFunction() { document.getElementById("myInput").style.backgroundColor = ""; } </script>