Prototipe - Penanganan Acara

Manajemen acara adalah salah satu tantangan terbesar untuk mencapai pembuatan skrip lintas browser. Setiap browser memiliki pendekatan berbeda untuk menangani penekanan tombol.

Prototipe Framework menangani semua masalah kompatibilitas lintas browser dan membuat Anda bebas dari semua masalah yang terkait dengan manajemen acara.

Kerangka kerja Prototipe menyediakan ruang nama Peristiwa , yang penuh dengan metode, yang semuanya mengambil objek peristiwa saat ini sebagai argumen, dan dengan senang hati menghasilkan informasi yang Anda minta, di semua browser utama.

Ruang nama acara juga menyediakan daftar standar kode kunci yang dapat Anda gunakan dengan acara terkait keyboard. Konstanta berikut ditentukan di namespace -

S.No.	Konstanta & Deskripsi Kunci
1.	KEY_BACKSPACE Mewakili kunci spasi belakang.
2.	KEY_TAB Mewakili tombol tab.
3.	KEY_RETURN Mewakili kunci pengembalian.
4.	KEY_ESC Mewakili kunci esc.
5.	KEY_LEFT Mewakili kunci kiri.
6.	KEY_UP Mewakili kunci.
7.	KEY_RIGHT Mewakili kunci yang benar.
8.	KEY_DOWN Mewakili kunci bawah.
9.	KEY_DELETE Mewakili kunci hapus.
10.	KEY_HOME Mewakili kunci rumah.
11.	KEY_END Mewakili kunci putus.
12.	KEY_PAGEUP Mewakili kunci halaman ke atas.
13.	KEY_PAGEDOWN Mewakili kunci halaman bawah.

Bagaimana Menangani Acara

Sebelum kita mulai, mari kita lihat contoh penggunaan metode event. Contoh ini menunjukkan cara menangkap elemen DOM tempat peristiwa terjadi.

Contoh

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         // Register event 'click' and associated call back.
         Event.observe(document, 'click', respondToClick);
  
         // Callback function to handle the event.
         function respondToClick(event) {
            var element = event.element();
            alert("Tag Name : " + element.tagName );
         }
      </script>
   </head>

   <body>
      <p id = "note"> Click on any part to see the result.</p>
      <p id = "para">This is paragraph</p>
      <div id = "division">This is divsion.</div>
   </body>
</html>

Keluaran

Berikut adalah daftar lengkap dari semua metode yang terkait Event. Fungsi yang paling sering Anda gunakan adalah mengamati , elemen , dan berhenti .

Metode Peristiwa Prototipe

NOTE - Pastikan Anda setidaknya memiliki prototype.js versi 1.6.

S.No.	Metode & Deskripsi
1.	elemen() Mengembalikan elemen DOM tempat kejadian terjadi.
2.	memperpanjang() Memperluas acara dengan semua metode yang terdapat dalam Event.Methods.
3.	findElement () Mengembalikan elemen DOM pertama dengan nama tag tertentu, lebih tinggi dari yang mana peristiwa terjadi.
4.	isLeftClick () Menentukan apakah peristiwa mouse terkait tombol adalah tentang tombol "kiri" (utama, sebenarnya).
5.	mengamati() Mendaftarkan penangan kejadian pada elemen DOM.
6.	pointerX () Mengembalikan posisi horizontal absolut untuk acara mouse.
7.	pointerY () Mengembalikan posisi vertikal absolut untuk acara mouse.
8.	berhenti() Menghentikan penyebaran acara dan mencegah tindakan default dipicu pada akhirnya.
9.	stopObserving () Membatalkan pendaftaran penangan acara.
10.	unloadCache () Batalkan pendaftaran semua penangan acara yang terdaftar melalui observasi. Kabel otomatis untuk Anda. Tidak tersedia sejak 1.6.