# 14: Acara Khusus - Trik CSS

Anonim

Karena kita baru saja membicarakan event, sekarang adalah saat yang tepat untuk menyebutkan event khusus. Semua peristiwa yang telah kita bicarakan sejauh ini adalah peristiwa "nyata". Peristiwa yang berasal dari DOM berdasarkan hal-hal nyata yang terjadi, seperti klik atau penekanan tombol. Peristiwa ini bisa "dipicu" secara artifisial di jQuery. Misalnya, untuk "memalsukan" klik pada tombol, Anda dapat melakukan:

$("#some-button").trigger("click");

Kemudian setiap penangan klik yang terikat ke tombol itu akan aktif seolah-olah pengguna benar-benar mengklik tombol itu. Tetapi bagaimana jika kita melakukannya:

$("#some-button").trigger("dance");

Lalu apa yang terjadi? "Menari" bukanlah acara "nyata". Tapi tidak ada kesalahan yang akan terjadi. Kebetulan mungkin tidak ada pawang "dance" yang terikat pada tombol itu. Tetapi mungkin ada dan pada dasarnya itulah peristiwa khusus. Acara dengan nama yang baru Anda buat.

Kenapa kamu ingin melakukan itu? Sebagian besar alasan organisasi. Mungkin Anda ingin memisahkan JavaScript yang menangani peristiwa dan tindakan, dan JavaScript yang menangani data dan hal-hal administratif. Itu sangat masuk akal. Jika tombol ini mungkin adalah tombol "Simpan Pengaturan", Anda dapat dengan mudah mengaktifkan peristiwa khusus bernama "simpan-pengaturan" dan di tempat lain memiliki penangan yang menunggu peristiwa tersebut diaktifkan dan melakukan penyimpanan data yang sebenarnya. Pada dasarnya itulah yang kami lakukan dalam contoh dari video.

Kasus penggunaan lain untuk peristiwa khusus adalah membuat komponen UI umum. Saya membicarakannya di postingan blog ini.

Mungkin Anda membuat efek akordeon sebagai komponen UI. Akordeon melakukan apa yang semua akordeon, buka dan tutup panel dengan klik / ketukan. Komponen UI Anda melakukannya dengan sangat baik. Sekarang pengembang yang menggunakan akordeon itu mungkin memiliki hal-hal khusus dan unik yang mereka inginkan terjadi dengannya. Katakanlah mereka menggunakan akordeon untuk pengaturan akun, dan ketika pengguna menutup panel, mereka ingin menyimpan data dari elemen formulir di panel itu. Model tradisional mungkin ditujukan bagi pembuat komponen UI akordeon tersebut untuk menawarkan fungsi callback saat tindakan itu terjadi. Saat Anda menginisialisasi akordeon, Anda meneruskan fungsi callback yang ingin Anda panggil saat hal itu terjadi. Itu salah satu jalan untuk turun. Jalan lain adalah agar akordeon hanya secara otomatis mengaktifkan peristiwa khusus untuk semua tindakan relevan yang dilakukannya.Ketika panel itu menutup, itu bisa mematikan apanelClosedacara pada elemen akordeon itu sendiri. Kemudian pengembang yang bekerja dengannya dapat mengikat ke acara tersebut. Ini hanyalah jalan lain yang bisa Anda tempuh karena alasan organisasi yang bisa sangat elegan.