Apakah Peristiwa dalam JavaScript dan bagaimana ia ditangani?

Peristiwa adalah tindakan atau kejadian yang berlaku dalam sistem. Dalam dunia pengaturcaraan, peristiwa adalah sesuatu yang berlaku pada elemen HTML. Tetapi apabila digunakan dalam halaman HTML, ia dapat bertindak balas terhadap peristiwa ini. Dalam artikel ini, kita akan melihat apa jenis peristiwa dalam JavaScript dan bagaimana ia berfungsi, dalam urutan berikut:

• Apakah Acara dalam JavaScript?
• Jenis Acara dalam JavaScript
  • Acara Onclick
  • Acara Onkeyup
  • Acara Onmouseover
  • Acara Beban
  • Acara Onfocus

Apakah Acara dalam JavaScript?

Javascript mempunyai acara yang menyediakan antara muka dinamik ke laman web. Peristiwa ini dihubungkan dengan unsur-unsur di Model Objek Dokumen (PENGHAKIMAN).

Juga, peristiwa ini secara lalai menggunakan penyebaran menggelegak iaitu, ke atas di DOM dari anak ke ibu bapa. Kita boleh mengikat acara sama ada sebaris atau dalam skrip luaran. Dengan bantuan JavaScript, anda dapat mengesan kapan peristiwa tertentu berlaku, dan menyebabkan sesuatu berlaku sebagai tindak balas terhadap peristiwa tersebut.

Jenis Acara dalam JavaScript

Terdapat pelbagai jenis acara di yang digunakan untuk bertindak balas terhadap peristiwa. Di sini, kita akan membincangkan beberapa acara terkenal atau yang paling biasa digunakan seperti:

• Dalam klik
• Kekunci
• Pengeluar rumah
• Beban
• Tumpuan

Oleh itu, mari kita teruskan dan lihat peristiwa ini dalam JavaScript dengan contoh.

Acara Onclick

Acara Onclick adalah peristiwa tetikus dan memprovokasi logik yang ditentukan sekiranya pengguna mengklik elemen yang diikatnya. Mari kita ambil contoh dan lihat bagaimana ia berfungsi:

fungsi edu () {alert ('Welcome to Edureka!')} Klik Butang

Pengeluaran:

Setelah Mengklik Butang, anda mendapat pesanan amaran berikut:

Acara Onekeyup

Acara ini adalah acara papan kekunci dan digunakan untuk melaksanakan petunjuk setiap kali kunci dilepaskan setelah menekan. Contoh berikut menunjukkan cara kerja acara tersebut:

var a = 0 var b = 0 var c = 0 perubahan fungsiBackground () {var x = document.getElementById ('bg') bg.style.backgroundColor = 'rgb (' + a + ',' + b + ',' + c + ')' a + = 1 b + = a + 1 c + = b + 1 jika (a> 255) a = a - b jika (b> 255) b = a jika (c> 255) c = b}

Pengeluaran:

Selepas anda menulis sesuatu, ia kelihatan seperti ini:

Acara Onmouseover

Peristiwa onmouseover dalam JavaScript sesuai dengan mengarahkan penunjuk tetikus ke elemen dan anak-anaknya, yang dengannya ia terikat. Contohnya ditunjukkan di bawah:

fungsi hov () {var e = document.getElementById ('hover') e.style.display = 'none'}

Pengeluaran:

menggunakan kelas pengimbas di java

Kotak berwarna muncul sebelum menuding tetikus. Sebaik sahaja anda mengarahkan tetikus ke atas kotak, ia akan hilang.

Acara Beban

Peristiwa muatan dibangkitkan apabila elemen dimuat sepenuhnya. Mari kita ambil contoh dan lihat bagaimana ia berfungsi:

Pengeluaran:

Acara Onfocus

Acara Onfocus mempunyai penyenaraian elemen yang melaksanakan arahan setiap kali menerima fokus. Contoh berikut menunjukkan cara kerja acara fokus:

fungsi terfokus () {var e = document.getElementById ('input') if (confirm ('Focus Event')) {e.blur ()}}
Fokus di Kotak Input:
 

Pengeluaran:

Ini adalah beberapa peristiwa yang paling kerap digunakan dalam JavaScript. Dengan ini, kami telah mengakhiri artikel kami. Saya harap anda memahami apa itu peristiwa dan bagaimana ia digunakan.

Lihat kami yang dilengkapi dengan latihan langsung yang dipimpin oleh instruktur dan pengalaman projek kehidupan sebenar. Latihan ini menjadikan anda mahir dalam kemahiran bekerja dengan teknologi web back-end dan front-end. Ia merangkumi latihan mengenai Pembangunan Web, jQuery, Angular, NodeJS, ExpressJS, dan MongoDB.

Ada soalan untuk kami? Sila sebutkan di bahagian komen blog ini dan kami akan menghubungi anda.