onblur ఇవెంట్

నిర్వచనం మరియు ఉపయోగం

onblur ఇవెంట్ ఒబ్జెక్ట్ ఫోకస్ కోల్పోయినప్పుడు జరుగుతుంది.

onblur ఇవెంట్ అత్యంత ఉపయోగించేది ఫారమ్ వెరిఫికేషన్ కోడ్‌తో కలిసి ఉపయోగించబడుతుంది (ఉదాహరణకు, వినియోగదారుడు ఫారమ్ ఫీల్డ్‌ను వదిలిపోయినప్పుడు).

సూచన: onblur ఇవెంట్ అనేది ఇలా ఉంటుంది: onfocus ఇవెంట్విపరీతంగా ఉంటుంది.

సూచన: onblur ఇవెంట్ అనేది ఇలా ఉంటుంది: onfocusout ఇవెంట్ఈ విధంగా నిర్వహించండి. ప్రధాన వ్యత్యాసం ఇది onblur ఇవెంట్ బాపిల్ కాదు. అందువల్ల, మీరు కొన్ని ఎలమెంట్‌ను లేదా దాని పిల్లలను ఫోకస్ కోల్పోయినాయి అని తెలుసుకోవాలి అయితే, onfocusout ఇవెంట్‌ను ఉపయోగించవచ్చు. కానీ, onblur ఇవెంట్‌ను ఉపయోగించి మీరు బాపిల్‌ను నియంత్రించవచ్చు. addEventListener() మంథనంయూజ్ కాప్చర్ పారామీటర్‌ను (ఆప్షనల్) ఈ పనిని చేయడానికి ఉపయోగించండి.

ప్రతిమాత్రము

వినియోగదారుడు ఇన్‌పుట్ ఫీల్డ్‌ను వదిలిపోయినప్పుడు జావాస్క్రిప్ట్ నిర్వహించండి:

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

స్వయంగా ప్రయత్నించండి

పేజీ కిందికి మరిన్ని TIY ఉదాహరణలు ఉన్నాయి。

సంకేతం

HTML‌లో ఉంది:

<element onblur="myScript">

స్వయంగా ప్రయత్నించండి

జావాస్క్రిప్ట్‌లో ఉంది:

ఆబ్జెక్ట్.onblur = function(){}myScript};

స్వయంగా ప్రయత్నించండి

జావాస్క్రిప్ట్ లో, addEventListener() మంథనాన్ని ఉపయోగించడం:

ఆబ్జెక్ట్.addEventListener("blur", myScript);

స్వయంగా ప్రయత్నించండి

ప్రకటన:ఇంటర్నెట్ ఎక్స్ప్లోరర్ 8 లేదా అంతకు ముంది వెర్షన్లు మద్దతు లేవు addEventListener() మంథనం.

టెక్నికల్ వివరణలు

బాపింగ్: మద్దతు లేదు
రద్దు చేయదగినది: మద్దతు లేదు
ఈవెంట్ రకం: FocusEvent
మద్దతు ఉండే HTML టాగ్స్: అన్ని HTML ఎలమెంట్స్, కాని: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> మరియు <title>
DOM వెర్షన్: లెవల్ 2 ఈవెంట్స్

బ్రాసర్ మద్దతు

ఈవెంట్ చ్రోమ్ ఐఇ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
onblur మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు

మరిన్ని ప్రతిమాత్రములు

ప్రతిమాత్రము

ఈవెంట్ లను onblur మరియు onfocus నాటికి ఉపయోగించండి:

<input type="text" onfocus="focusFunction()" onblur="blurFunction()">

స్వయంగా ప్రయత్నించండి

ప్రతిమాత్రము

ఈవెంట్ డెలిగేషన్: addEventListener() యొక్క useCapture పారామితిని true చేయండి:

<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>

స్వయంగా ప్రయత్నించండి

ప్రతిమాత్రము

ఈవెంట్ డెలిగేషన్: focusin ఈవెంట్ ఉపయోగించడం (Firefox మద్దతు లేదు):

<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>

స్వయంగా ప్రయత్నించండి