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

Categories: Blogspot, CSS, JQuery