HTML DOM Element addEventListener()
ဥပမာများ
<button> ဒြပ်စင်သို့ ကလစ်ဖြစ်ရပ်တစ်ခု ထည့်ပါ-
element.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
ပိုမိုသေးငယ်သောကုဒ်-
element.addEventListener("click", function() {
document.getElementById("demo").innerHTML = "Hello World";
});
အောက်တွင် နောက်ထပ် ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
addEventListener()
နည်းလမ်းသည် ဖြစ်ရပ်ကိုင်တွယ်သူကို ဒြပ်စင်သို့ ပူးတွဲသည် ။
ကိုလည်းကြည့်ပါ-
element.removeEventListener() နည်းလမ်း
document.addEventListener() နည်းလမ်း
document.removeEventListener() နည်းလမ်း
ကျူတိုရီရယ်များ
အထားအသို
element.addEventListener(event, function, useCapture)
ကန့်သတ်ချက်များ
Parameter | Description |
event | Required. The name of the event. Do not use the "on" prefix. Use "click" not "onclick". The Complete List of DOM Events. |
function | Required. The function to run when the event occurs. |
useCapture |
Optional (default = false).false - The handler is executed in the bubbling phase.true - The handler is executed in the capturing phase.
|
တန်ဖိုးကို ပြန်ပေးသည်။
မရှိပါ။ |
နောက်ထပ် ဥပမာများ
တူညီသောဒြပ်စင်သို့ ဖြစ်ရပ်များစွာကို သင်ထည့်သွင်းနိုင်သည်-
element.addEventListener("click", myFunction1);
element.addEventListener("click", myFunction2);
တူညီသောဒြပ်စင်သို့ မတူညီသောဖြစ်ရပ်များကို သင်ထည့်သွင်းနိုင်သည်-
element.addEventListener("mouseover", myFunction);
element.addEventListener("click", someOtherFunction);
element.addEventListener("mouseout", someOtherFunction);
ကန့်သတ်ဘောင်တန်ဖိုးများကို ကျော်ဖြတ်ရန် "အမည်မသိလုပ်ဆောင်ချက်" ကို အသုံးပြုပါ-
element.addEventListener("click", function() {
myFunction(p1, p2);
});
<button> ဒြပ်စင်တစ်ခု၏ နောက်ခံအရောင်ကို ပြောင်းပါ-
element.addEventListener("click", function() {
this.style.backgroundColor = "red";
});
ပွက်ပွက်ရိုက်ခြင်းနှင့် ဖမ်းခြင်းကြား ကွာခြားချက်
element1.addEventListener("click", myFunction, false);
element2.addEventListener("click", myFunction, true);
အစီအစဉ်ကိုင်တွယ်သူကို ဖယ်ရှားပါ-
element.addEventListener("mousemove", myFunction);
element.removeEventListener("mousemove", myFunction);
Browser ပံ့ပိုးမှု
element.addEventListener()
DOM Level 2 (2001) အင်္ဂါရပ်တစ်ခုဖြစ်သည်။
ဘရောက်ဆာအားလုံးတွင် ၎င်းကို အပြည့်အဝထောက်ခံသည်-
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |