పరిశీలన సిద్ధాంతం:
onfocusin ఇవెంట్
నిర్వచనం మరియు ఉపయోగం
ఫైర్ఫాక్స్ లో onfocusin ఇవెంట్ మద్దతు లేదు కానీ, onfocus ఇవెంట్ క్యాప్చర్ లిస్టెనర్ ఉపయోగించి (addEventListener() మాదిరి విధంగా ఆప్షనల్ useCapture పారామీటర్ ఉపయోగించి) అంశం లేదా అంశం పిల్లలు అందుకున్నాయో తెలుసుకోవచ్చు. ప్రధాన వ్యత్యాసం అనేది onfocus ఇవెంట్ బాహ్య వాతావరణం ప్రభావితం చేయకూడదు. కాబట్టి, మీరు ఒక అంశం లేదా అంశం పిల్లలు అందుకున్నాయో తెలుసుకోవాలంటే, onfocusin ఇవెంట్ ఉపయోగించాలి.onfocusin ఇవెంట్ అంశం కింద జరుగుతుంది. onfocus ఇంటర్నెట్ ఇవెంట్onfocusin ఇవెంట్ అనేది
ఫైర్ఫాక్స్ లో onfocusin ఇవెంట్ మద్దతు లేదు కానీ, onfocus ఇవెంట్ క్యాప్చర్ లిస్టెనర్ ఉపయోగించి (addEventListener() మాదిరి విధంగా ఆప్షనల్ useCapture పారామీటర్ ఉపయోగించి) అంశం లేదా అంశం పిల్లలు అందుకున్నాయో తెలుసుకోవచ్చు. ప్రధాన వ్యత్యాసం అనేది onfocus ఇవెంట్ బాహ్య వాతావరణం ప్రభావితం చేయకూడదు. కాబట్టి, మీరు ఒక అంశం లేదా అంశం పిల్లలు అందుకున్నాయో తెలుసుకోవాలంటే, onfocusin ఇవెంట్ ఉపయోగించాలి..
ఫైర్ఫాక్స్ లో onfocusin ఇవెంట్ మద్దతు లేదు కానీ, onfocus ఇవెంట్ క్యాప్చర్ లిస్టెనర్ ఉపయోగించి (addEventListener() మాదిరి విధంగా ఆప్షనల్ useCapture పారామీటర్ ఉపయోగించి) అంశం లేదా అంశం పిల్లలు అందుకున్నాయో తెలుసుకోవచ్చు. ప్రధాన వ్యత్యాసం అనేది onfocus ఇవెంట్ బాహ్య వాతావరణం ప్రభావితం చేయకూడదు. కాబట్టి, మీరు ఒక అంశం లేదా అంశం పిల్లలు అందుకున్నాయో తెలుసుకోవాలంటే, onfocusin ఇవెంట్ ఉపయోగించాలి.సలహా: onfocusout ఇంటర్నెట్ ఇవెంట్onfocusin ఇవెంట్ తో
విపరీతంగా.
ఉదాహరణ
ఉదాహరణ 1
ఇన్పుట్ ఫీల్డ్ దగ్గర అందుకునే క్షణంలో జావాస్క్రిప్ట్ అమలు చేయండి:
<input type="text" onfocusin="myFunction()">
పేజీ కింద మరిన్ని TIY ఉదాహరణలు ఉన్నాయి。
సంకేతం:
హెచ్ఎంఎల్ లో విధంగా:< element.addEventListener("focusin",onfocusin="
">
జావాస్క్రిప్ట్ లో అడ్డెంటర్ లిస్టెనర్ మాదిరి విధంగా:జావాస్క్రిప్ట్ లో (క్రోమ్, సఫారీ మరియు ఓపేరా 15+ లో సరిగా పని చేయకూడదు):.addEventListener("focusin",.onfocusin = function(){
};
జావాస్క్రిప్ట్ లో అడ్డెంటర్ లిస్టెనర్ మాదిరి విధంగా:object .addEventListener("focusin",myScript
ప్రత్యామ్నాయ పేరు:); ఇంటర్నెట్ ఎక్స్ప్లోరర్ 8 లేదా అంతకు ముంది వర్షాలు మద్దతు లేదు:addEventListener() మాదిరి విధంగా:
.
| సాంకేతిక వివరాలు: | మద్దతు |
|---|---|
| బాహ్య వాతావరణం ప్రభావితం చేయగలిగే విధంగా: | రద్దు చేయగలిగే విధంగా: |
| మద్దతు లేదు: | FocusEvent |
| మద్దతు పొందే హెచ్ఎంఎల్ టాగ్స్: | అన్ని హెచ్ఎంఎల్ ఎలిమెంట్స్, మినహా <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> మరియు <title> |
| DOM వెర్షన్: | లెవల్ 2 ఈవెంట్లు |
బ్రౌజర్ మద్దతు
పట్టికలో వరుసలు ఈ ఈవెంట్ని పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ వెర్షన్ని చూపిస్తాయి.
| ఈవెంట్ | క్రోమ్ | ఐఇ | ఫైర్ఫాక్స్ | సఫారీ | ఓపెరా |
|---|---|---|---|---|---|
| onfocusin | మద్దతు | మద్దతు | 52.0 | మద్దతు | మద్దతు |
ప్రత్యామ్నాయ పేరు:onfocusin ఈవెంట్ onfocusin ఉపయోగించినప్పుడు JavaScript HTML DOM సంకేతపత్రంలో క్రోమ్, సఫారీ మరియు ఓపెరా 15+ లో అనుమానంగా పని చేయవచ్చు. అయితే, ఇది 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>
