Fungsi Callback pada jQuery

Fungsi Callback pada jQuery - Salah satu fungsi dari sekian banyak fungsi - fungsi yang ada pada jQuery adalah fungsi callback, dimana fungsi callback akan dijalankan setelah efek sebelumnya selesai dijalankan. Misalnya kita ingin menampilkan alert atau pesan setelah ada efek selesai dijalankan terlebih dahulu. Nah, semua itu bisa kita buat dengan menggunakan fungsi callback yang ada pada jQuery, agar lebih jelas saya akan berikan contoh sederhana dan bagaimana penggunaan fungsi callback pada jQuery.

Fungsi Callbcak

Secara umum bentuk callback diketikan seperti berikut.

$(selector).hide(speed, callback);
  • $(selector) adalah elemen atau selector yang dijadikan objek efeknya
  • hide(speed, callback) adalah metode untuk menyembuyikan elemen dan 
  • callback adalah fungsi yang nantinya akan ditambahkan setelah efek selesai dijalankan

Pada kasus ini saya akan buat efek untuk menyembunyikan suatu elemen yaitu berupa gambar dimana akan ada pesan setelah menjalankan efek menyembunyikan gambarnya. Untuk itu kalian bisa ketikan kode berikut ini.

<head>
    <title>Fungsi Callback pada jQuery</title>
</head>
<body>
    <p><button>Hide Images</button></p>
    <img src="dumet-school.jpg">
</body>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
    $(document).ready(function(){
      $("button").click(function(){
        $("img").hide("slow", function(){
          alert("Gambar Berhasil Disembunyikan!");
        });
      });
    });
</script>

Dari kode yang kita buat diatas artinya ketika kita mengklik tombol button akan terjadi efek menyembunyikan gambar yang sudah diset kemudian akan dilanjutkan dengan fungsi callback yang memberikan alert berupa pesan bahwa gambar berhasil disembunyikan. 

Untuk mengaplikasikan callback tidak terbatas pada elemen gambar saja, kalian gunakan callback pada setiap elemen apapun yang diinginkan. Sekian pembahasan Fungsi Callback pada jQuery semoga pembahasan singkat ini bisa bermanfaat :)

25 September 2019

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Kursus Postgre SQL Database Developer Terbaik 2024 di Jakarta
chat