JQuery onClick, toggleFade

Cara menggunakan fungsi onClick pada JQuery adalah sebagai berikut.

ELemen yang diklik

//perhatikan id yang digunakan 
<div id="klik">klik aku</div>

Tampilan/pesan ketika sudah diklik

//perhatikan id yang digunakan 
<div id="msg">Terimakasih telah berkenan menyentuhku</div>

Script JQuery onClick

//import file jQuery
<script type="text/javascript" src="sumber/jquery.js"></script>
<script type="text/javascript">
//agar jQuery bekerja ketika dokumen siap
$(document).ready(function(){
//menyembunyikan isi pesan 
$('#msg').hide();
//memberi event onclick pada id klik
$('#klik').click(function(){
//memberi tugas pada id msg agar tampil
$('#msg').fadeToggle(500);
});
});
</script>

Keterangan: fungsi fadeToggle digunakan untuk even ganda. Pada script ini, event (klik) pertama menampilkan isi pesan dengan animasi fade. event (klik) kedua menyembunyikan isi pesan dengan animasi fade.

Contoh

klik aku

Terimakasih telah berkenan menyentuhku