addEventListener()
Misollar
Hujjatga click hodisasini qo‘shing:
document.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
O‘zingiz sinab ko‘ring »
Soddaroq sintaksis:
document.addEventListener("click", function(){
document.getElementById("demo").innerHTML = "Hello World";
});
O‘zingiz sinab ko‘ring »
Quyida ko‘proq misollar.
Tavsif
addEventListener() metodi hujjatga hodisa ishlovchisini biriktiradi.
Element metodlari
Document metodlari
Darsliklar
Sintaksis
document.addEventListener(event, function, Capture)
Parametrlar
| Parametr | Tavsif |
| event | Majburiy. Hodisa nomi. "on" prefiksidan foydalanmang. "onclick" emas, "click" yozing. Barcha HTML DOM hodisalari quyidagi sahifada keltirilgan: HTML DOM Event obyekti ma’lumotnomasi. |
| function | Majburiy. Hodisa sodir bo‘lganda ishga tushadigan funksiya. Hodisa sodir bo‘lganda funksiyaga birinchi parametr sifatida event obyekti uzatiladi. event obyektining tipi belgilangan hodisaga bog‘liq. Masalan, "click" hodisasi MouseEvent obyektiga tegishli. |
| capture | Ixtiyoriy (standart = false).true - Ishlovchi ushlash (capturing) bosqichida bajariladi.false - Ishlovchi ko‘tarilish (bubbling) bosqichida bajariladi. |
Qaytariladigan qiymat
| YO‘Q |
Ko‘proq misollar
Hujjatga ko‘plab hodisa tinglovchilarini qo‘shishingiz mumkin:
document.addEventListener("click", myFunction1);
document.addEventListener("click", myFunction2);
O‘zingiz sinab ko‘ring »
Turli xil hodisalarni qo‘shishingiz mumkin:
document.addEventListener("mouseover", myFunction);
document.addEventListener("click", someOtherFunction);
document.addEventListener("mouseout", someOtherFunction);
O‘zingiz sinab ko‘ring »
Parametr uzatishda funksiyani parametrlar bilan chaqirish uchun "anonim funksiya"dan foydalaning:
document.addEventListener("click", function() {
myFunction(p1, p2);
});
O‘zingiz sinab ko‘ring »
Hujjatning fon rangini o‘zgartiring:
document.addEventListener("click", function(){
document.body.style.backgroundColor = "red";
});
O‘zingiz sinab ko‘ring »
removeEventListener() metodidan foydalanish:
// Add an event listener
document.addEventListener("mousemove", myFunction);
// Remove event listener
document.removeEventListener("mousemove", myFunction);
O‘zingiz sinab ko‘ring »
Brauzerlarda qo‘llab-quvvatlash
document.addEventListener — DOM Level 2 (2001) imkoniyati.
U barcha brauzerlarda to‘liq qo‘llab-quvvatlanadi:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Ha | Ha | Ha | Ha | Ha | 9-11 |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!
