Friday, April 6, 2012

JQuery .next() dan .prev()

jQuery .next() dan .prev()

.prev() digunakan untuk menyeleksi elemen sebelum elemen pemicu, .next() digunakan untuk menyeleksi elemen setelah elemen pemicu. Misalnya, kita memiliki elemen berupa tombol dan satu buah elemen divisi:

<button>Klik!</button>
<div></div>

Saat tombol tersebut diklik, kita harap elemen <div> di bawahnya (dalam hal ini: elemen yang terletak tepat setelah tombol) akan beranimasi dengan efek .slideUp(). Kita bisa menuliskan perintahnya seperti ini:

$('button').click(function() {
    $(this).next().slideUp();
});

Hal yang tidak jauh berbeda juga dengan .prev() yang akan menyeleksi elemen yang berada tepat sebelum elemen pemicu:

$('button').click(function() {
    $(this).prev().fadeOut();
});

Coba Sendiri

Labels: ,

3 Comments:

At Friday, April 6, 2012 at 4:00:00 PM GMT+7, Blogger MUX SPARROW said...

Wow! keren2 nih petunjuknya.. javascript tambahannya juga pendek aja ya..?? (sok paham :D ) *berasa ingin make semuanya di satu blog.. :( btw, kalo ane perhatiin, jquery yang paling banyak manfaatnya tuh yang seri 1.7 ya, Gan..
nanti ane cobain satu-satu ah..

 
At Friday, April 6, 2012 at 6:51:00 PM GMT+7, Blogger Taufik Nurrohman said...

@MUXLIMO Itu cuma pengembangan dari versi-versi sebelumnya. Semuanya sama saja. Lebih baik pakai versi yang terakhir, yaitu 1.7

 
At Tuesday, April 17, 2012 at 11:16:00 PM GMT+7, Blogger Fahmi Athailla said...

Hmmmm, kalo misalkan itu di taro di Selection Class komentar yang Show/Hide gimana jadinya ya???? heheheee.......

 

Post a Comment

<< Home