Event form

Siapkan HTML Form

Pertama, Anda perlu membuat formulir HTML. Contoh sederhana formulir dapat terlihat seperti ini:

<form id="myForm">
   <label for="name">Nama:</label>
   <input type="text" id="name" name="name"><br><br>

   <label for="email">Email:</label>
   <input type="email" id="email" name="email"><br><br>

   <input type="submit" value="Submit">
</form>

Sisipkan jQuery

Pastikan Anda telah menyertakan jQuery di halaman HTML Anda, seperti ini:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

Tambahkan JavaScript

Selanjutnya, tambahkan kode jQuery untuk menangani event formulir. Misalnya, kita akan menambahkan event handler untuk menampilkan pesan saat formulir disubmit:

<script>
   $(document).ready(function() {
       // Event handler ketika formulir disubmit
       $("#myForm").submit(function(event) {
           event.preventDefault(); // Mencegah pengiriman formulir default

           // Ambil nilai dari input nama
           var name = $("#name").val();

           // Tampilkan pesan dengan nama yang diisi
           alert("Halo, " + name + "! Formulir telah disubmit.");
       });
   });
</script>

Jalankan Kode

Terakhir, pastikan halaman HTML Anda dimuat, dan ketika formulir disubmit, akan muncul alert dengan pesan yang sesuai.

Ini hanya contoh sederhana. Anda dapat menangani event lain seperti "click," "change," atau "keyup" pada elemen-elemen formulir sesuai kebutuhan Anda. Semoga tutorial ini membantu Anda memahami penggunaan jQuery untuk menangani event formulir!