JavaScript funksiyalari yordamida hodisalarni qayta ishlash



Download 253,18 Kb.
Sana02.03.2022
Hajmi253,18 Kb.
#478950
Bog'liq
JavaScript funksiyalari yordamida hodisalarni qayta ishlash (1)


JavaScript funksiyalari yordamida hodisalarni qayta ishlash
REJA:

  1. JavaScriptda hodisalarga kirish.

  2. Hodisalarni qayta ishlovchilar.

  3. Hodisa obyekti.

  4. Qayta ishlovchi obyekt: handleEvent.

  5. Xulosa.

  6. Foydalanilgan adabiyotlar.

JavaScriptda hodisalarga kirish


Hodisa - bu brauzer tomonidan biron bir narsa yuz berganligi haqidagi signal. Barcha DOM tugunlari bunday signallarni chiqaradi (garchi voqealar nafaqat DOMda sodir bo'lmasa ham).

Bu erda eng tez-tez ishlatiladigan DOM hodisalari ro'yxati:



  • Click – sichqonchaning chap tugmasini bosgnada sodir bo’ladi;

  • Contextmenu - sichqonchaning o’ng tugmasini elementga bosganda sodir bo’ladi;

  • Mouseover/mouseout – kursor ustiga kelganda / kursor element ustidan ketganda;

  • Mousedown/mouseup – sichqonchani bosganda va qo’yib yuborganda;

  • Mousemove – sichqonchani qo’zg’atganda sodir bo’ladigan hodisa.

Boshqaruv elemtlaridagi hodissalar:



  • Submit – foydalanuvhi forma jo’natganda;

  • Focus – foydalanuvchi elementga e’tiborini qaratganda, misol uchun elementini bosganda.

Klaviatura hodisalari:





  • Keydown va keyup - foydalanuvchi tugmachani bosganda / qo'yganda.

Hujjat hodisalari:





  • DOMContentLoaded - HTML yuklanganda va ishlov berilganda, hujjatning DOM-i to'liq qurilgan va undan foydalanish mumkin.

CSS hodisalar:

  • transitionend - CSS animatsiyasi tugashi bilan.

Hodisalarni qayta ishlovchilar


Hodisaga ishlov berish vositasi tayinlanishi mumkin, ya'ni hodisa ro'y berganda darhol ishga tushadigan funksiya.
Aynan JavaScript kodi foydalanuvchilarning harakatlariga javob qaytarishi mumkin.
Hodisaga qayta ishlov beruvchisini tayinlashning bir necha yo'li mavjud. Endi biz ularni eng oddiylaridan boshlab ko'rib chiqamiz.
HTML ATRIBUTI ORQALI
Element atributiga ‘on’ qo’shish orqali. Misol uchun click hodiasini input elementi ishlatsa bo’ladi:


Tugmani bosganingizda, onclick atributida ko'rsatilgan kod bajariladi.

HTML tegi atributi ko'p kodlarni yozish uchun qulay joy emas, shuning uchun alohida JavaScript funktsiyasini yaratib, u yerga murojaat qilish yaxshiroqdir.

Ushbu misolimiz quyonlarni sanash funksiyasini ishga tushiradi:




DOM-OBYEKT XUSUSIYATIDAN FOYDALANISH


DOM-elementi xususiyatlaridan foydalanib hodisani tayinlash mumkin. Misol uchun, elem.onclick:




HODISA OBYEKTI


Voqeani yaxshi boshqarish uchun sizga nima bo'lganligi haqida tafsilotlar kerak bo'lishi mumkin. Faqat "bosish" yoki "tugmachani bosish" emas, balki sichqoncha ko'rsatgichining qaysi koordinatalari, qaysi tugma bosilgan va hokazo.

Hodisa ro'y berganda, brauzer voqea ob'ekti yaratadi, unga tafsilotlarni yozadi va uni ishlov berish funktsiyasi uchun argument sifatida uzatadi.

Quyidagi misol voqea ob'ektidan sichqonchaning koordinatalarini olishni namoyish etadi:





Hodisa ob'ekti ba'zi ob'ektlari:
Event.type
Tadbir turi, bu holda "cherting".
event.currentTarget
Protsessor ishlov beriladigan element. Odatda bu qiymat bir xil bo'ladi, agar u boshqa ob'ektni bog'lash uchun bog'laydigan yordamchi strelka bo'lmasa, men event.currentTarget-dan elementni olishim mumkin.
event.clientX / event.clientY
Voqealar oynasini bosish paytida kursorning koordinatalari.

QAYTA ISHLOVCHI OBYEKT: handleEvent


Biz nafaqat ishlov beruvchiga funktsiyani, balki addEventListener-dan foydalanib ob'ektni ham tayinlashimiz mumkin. Bunday holda, voqea sodir bo'lganda, holdEvent ob'ekt usuli chaqiriladi.
Masalan:



Ko'rinib turibdiki, agar addEventListener ob'ektni ishlov beruvchi sifatida qabul qilsa, hodisa ro'y berganda object.handleEvent (event) ni chaqiradi.

Buning uchun biz sinfdan ham foydalanishimiz mumkin:



Bu erda bir xil ob'ekt ikkala hodisani ham boshqaradi. E'tibor bering, ikkala ishlov beruvchini addEventListener orqali aniq tayinlashimiz kerak. Keyin menyu ob'ekti mousedown va sichqonchani bosib o'tish hodisalarini oladi, ammo boshqa (tayinlanmagan) hodisalar turlarini.

HandEvent usuli barcha ishlarni o'zi bajarishi shart emas. Bu kabi hodisalarni muayyan turlarini boshqarish uchun moslashtirilgan boshqa usullarni chaqirish mumkin:



Endi hodisalarni qayta ishlash kodlarni qo'llab-quvvatlashni soddalashtiradigan usullarga bo'linadi.

XULOSA
Hodisalarni boshqaruvchilarni tayinlashning uchta usuli mavjud:

HTML atributi: onclick = "...".


DOM xususiyati: elem.onclick = funktsiya.
Maxsus usullar: qo'shish uchun elem.addEventListener (voqea, ishlov beruvchi [, faza]), olib tashlash uchun o'chirishEventListener.
HTML atributlari kam ishlatiladi, chunki HTML yorlig'idagi JavaScript biroz g'alati ko'rinadi. Bundan tashqari, siz u erda ko'p kod yozolmaysiz.

DOM xususiyatlaridan foydalanish mumkin, ammo biz bir xil hodisaga bittadan ortiq ishlov beruvchini tayinlay olmaymiz. Ko'p hollarda, ushbu cheklovga yo'l qo'yilishi mumkin.

Ikkinchi usul eng moslashuvchan, ammo kodning ko'p qismini yozishingiz kerak. Faqatgina u orqali ishlaydigan bir nechta turdagi tadbirlar mavjud, masalan, o'tish va DOMContentLoaded. AddEventListener shuningdek ob'ektlarni tadbirlarni boshqaruvchisi sifatida qo'llab-quvvatlaydi. Bunday holda, holdEvent ob'ekt usuli chaqiriladi.

Ishlov beruvchini qanday tayinlashingizdan qat'iy nazar, u voqea ob'ektini o'zining birinchi dalili sifatida qabul qiladi. Ushbu ob'ektda nima bo'lganligi haqida tafsilotlar mavjud.


FOYDALANILGAN ADABIYOTLAR



  1. https://learn.javascript.ru/introduction-browser-events#itogo

  2. https://developer.mozilla.org/ru/docs/Learn/JavaScript/Building_blocks/%D0%A1%D0%BE%D0%B1%D1%8B%D1%82%D0%B8%D1%8F

  3. W3schools.com

  4. Ma’ruza matnlari.

Download 253,18 Kb.

Do'stlaringiz bilan baham:




Ma'lumotlar bazasi mualliflik huquqi bilan himoyalangan ©hozir.org 2024
ma'muriyatiga murojaat qiling

kiriting | ro'yxatdan o'tish
    Bosh sahifa
юртда тантана
Боғда битган
Бугун юртда
Эшитганлар жилманглар
Эшитмадим деманглар
битган бодомлар
Yangiariq tumani
qitish marakazi
Raqamli texnologiyalar
ilishida muhokamadan
tasdiqqa tavsiya
tavsiya etilgan
iqtisodiyot kafedrasi
steiermarkischen landesregierung
asarlaringizni yuboring
o'zingizning asarlaringizni
Iltimos faqat
faqat o'zingizning
steierm rkischen
landesregierung fachabteilung
rkischen landesregierung
hamshira loyihasi
loyihasi mavsum
faolyatining oqibatlari
asosiy adabiyotlar
fakulteti ahborot
ahborot havfsizligi
havfsizligi kafedrasi
fanidan bo’yicha
fakulteti iqtisodiyot
boshqaruv fakulteti
chiqarishda boshqaruv
ishlab chiqarishda
iqtisodiyot fakultet
multiservis tarmoqlari
fanidan asosiy
Uzbek fanidan
mavzulari potok
asosidagi multiservis
'aliyyil a'ziym
billahil 'aliyyil
illaa billahil
quvvata illaa
falah' deganida
Kompyuter savodxonligi
bo’yicha mustaqil
'alal falah'
Hayya 'alal
'alas soloh
Hayya 'alas
mavsum boyicha


yuklab olish