Event ကိုအာရုံစိုက်ပါ ။
ဥပမာ
ထည့်သွင်းအကွက်တစ်ခုအာရုံစိုက်လာသောအခါ JavaScript ကို လုပ်ဆောင်ပါ-
<input type="text"
onfocus="myFunction()">
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
ဒြပ်စင်တစ်ခုသည် အာရုံစူးစိုက်မှုရရှိသောအခါတွင် အာရုံစူးစိုက်မှုဖြစ်ရပ် ဖြစ်ပေါ်သည်။
onfocus event ကို <input>၊ <select> နှင့် <a> တို့နှင့် အများဆုံးအသုံးပြုပါသည်။
အကြံပြုချက်- onfocus event သည် onblur event နှင့် ဆန့်ကျင်ဘက် ဖြစ်သည် ။
အကြံပြုချက်- onfocus event သည် onfocusin event နှင့် ဆင်တူသည် ။ အဓိက ခြားနားချက်မှာ အာရုံစူးစိုက်မှု ဖြစ်စဉ်သည် ပူဖောင်းမရှိခြင်း ဖြစ်သည်။ ထို့ကြောင့်၊ ဒြပ်စင်တစ်ခု သို့မဟုတ် ၎င်း၏ကလေးသည် အာရုံစူးစိုက်မှုကို ရရှိသည်ဆိုသည်ကို သင်သိရှိလိုပါက၊ သင်သည် onfocusin ဖြစ်ရပ်ကို အသုံးပြုနိုင်သည်။ သို့သော်လည်း၊ onfocus event အတွက် addEventListener() method ၏ ရွေးချယ်နိုင်သော useCapture parameter ကိုအသုံးပြုခြင်းဖြင့် ၎င်းကို သင်အောင်မြင်နိုင်ပါသည်။
Browser ပံ့ပိုးမှု
Event | |||||
---|---|---|---|---|---|
onfocus | Yes | Yes | Yes | Yes | Yes |
အထားအသို
HTML တွင်-
<element onfocus="myScript">
JavaScript တွင်-
object.onfocus = function(){myScript};
JavaScript တွင် addEventListener() method ကိုအသုံးပြု၍-
object.addEventListener("focus", myScript);
မှတ်ချက်- addEventListener () နည်းလမ်းကို Internet Explorer 8 နှင့် အစောပိုင်းဗားရှင်းများတွင် ပံ့ပိုးမထားပါ။
နည်းပညာဆိုင်ရာအသေးစိတ်
ပူဖောင်း: | မရှိ |
---|---|
ပယ်ဖျက်နိုင်သည်- | မရှိ |
ပွဲအမျိုးအစား- | FocusEvent |
ပံ့ပိုးထားသော HTML တဂ်များ- | HTML ဒြပ်စင်များ မှလွဲ၍ ကျန်- <base>၊ <bdo>၊ <br>၊ <head>၊ <html>၊ <iframe>၊ <meta>၊ <param>၊ <script>၊ <style> နှင့် <title> |
DOM ဗားရှင်း- | အဆင့် 2 ပွဲများ |
နောက်ထပ် ဥပမာများ
ဥပမာ
"onblur" event နှင့် "onfocus" ကိုအသုံးပြုခြင်း-
<input type="text" onfocus="focusFunction()" onblur="blurFunction()">
ဥပမာ
အာရုံစိုက်မှုတွင် ထည့်သွင်းသည့်အကွက်ကို ရှင်းရန်-
<!-- When the input field gets focus, replace its current value with an
empty string -->
<input type="text" onfocus="this.value=''" value="Blabla">
ဥပမာ
ပွဲကိုယ်စားလှယ်အဖွဲ့- addEventListener() ၏ useCapture parameter ကို အမှန်အဖြစ် သတ်မှတ်ခြင်း-
<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 event ကိုအသုံးပြုခြင်း (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>