Belajar jQuery Part 4 : Memahami Callback Function Serta Contohnya

Ditulis oleh Irvan Nurfazri

Halo teman -teman salam jumpa kembali di pertemuan yang ke-4 di sesi belajar jQuery. Pada pertemuan ini saya akan mengulas tentang Memahami Callback Fuction serta Contohnya.

Callback function adalah sebuah fungsi jika fungsi efek selesai dijalankan. Misalkan, kamu telah selesai menjalankan effect function dan ingin menjalankan fungsi lagi, maka ini yang disebut dengan Callback function.

Untuk lebih jelas lagi akan saya buatkan contohnya, kita akan membuat contoh Efek fadeIn(), setelah fungsi efek fadeIn() selesai dijalankan, maka kita akan menjalankan lagi fungsi lain(Callback Function). Disini saya tulis kode programnya

Baca: Effect pada jQuery

index.html

style.css

Perhatikan pada index.html. Disana terdapat sebuah element kotak yang telah diberi class “box” dan sebuah kotak yang berwarna merah, kotak merah ini kita sembunyikan dengan css. Nah untuk contoh Callback Function ini kita membuat kotak merah, apabila tombol “klik” ditekan.

Setelah effect fadeIn() selesai dijalankan, maka akan dilanjutkan dengan fungsi selanjutnya, yaitu Callback Function. Untuk lebih jelasnya silahkan jalankan file yang sudah dibuat tadi.

Callback Function - #IRVANGEN
Callback Function – #IRVANGEN

Bagaimana Bisa Berjalan?

Bisa diperhatikan lagi pada kode program index.html

Disini kotak merah ditampilkan setelah fungsi efek selesai dijalankan(.box) kemudian dilanjutkan dengan menjalankan Callback(.kotak_merah) sehingga dapat berjalan sesuai yang ditentukan.


Penutup

Mungkin itu saja yang dapat saya sampaikan di pertemuan ini, tentang Mengenal Fungsi Callback. Jika kurang mengerti atau salah dalam penulisan maupun penyampaian, silahkan diskusikan di form komentar, semoga apa yang sudah kita pelajari dapat bermanfaat bagi kita semua.

Terimakasih.

Tentang Penulis

Irvan Nurfazri

No one can bring you true happiness except Allah

Instagram : ig.com/irvan_gen

Tinggalkan Komentar