Senin, 25 Oktober 2010

Membuat Plugin jQuery


Untuk membuat plugin jQuery sebenarnya cukup mudah. berikut ini adalah langkah - langkahnya

1. Buat kode jQuery.fn.myFunction = function(args,e){}
2. Modifikasi kode tersebut
3. Test kode tersebut.




jQuery.fn.myFunction = function(args,e) {

//gunakan kata kunci this untuk menunjuk object/element saat ini
//ini karena function bersifat relatif terhadap element hasil selection jquery

return this.each(function(){

$(this).click(function(){
alert("hello saya custom plugin");
});

};
};



Nah sampai disini anda sudah membuat plugin untuk jquery.Simpan file diatas dengan nama myplugin.js

Berikut ini cara penggunaannnya. Asumsi file myplugin.js dan jquery.js diletakan dalam folder yang sama.



<html>
<head>
<Script language="javascript" src="jquery.js"></script>
<Script language="javascript" src="myplugin.js"></script>
<Script language="javascript">

$(document).ready(function(){

//1. selection diaktifkan pada element html yang memiliki kelas mylabel
//2. panggil custom plugin/function

$(".mylabel").myfunction();

});

</script>
</head>
<body>
<label class='mylabel'>klik me</label>
</body>
</html>




Nah, jika tidak ada masalah, maka apabila kamu mengklik label tersebut maka akan muncul pesan alert yang berasal dari custom plugin/function. Selamat Mencoba dan Happy Coding!

2 komentar:

  1. trus utk melihatnya pakai apa yah?
    karena fle .html nya gak ada..

    BalasHapus
  2. untuk menggunakannya tinggal pasang aja dalam file html. didalam tag script. nah coba baca cara memulai jquery

    BalasHapus

Isi Komentar / Pertanyaan