Postingan lainnya

cara memakai $(this) pada jquery

gimana cara menggunakan $(this) pada jquery untuk menselect sebuah selektor..? contoh : ane punya 1 button id= btn-1 punya 1 div class=exceprt yang isinya tag p -- nah #btn-1 dan .exceprt itu ane loop pake php, nah ane mau buat ketika #btn-1 di klik, hanya .exceprt yang satu selektor dengan #btn-1 yang diklik yang di eksekusi.

<!-- while-->
 <div class="show">
  <div class="ipsm">
      <button type="button" id="btn-ipsm" class="btn-ipsm"><i class="fa fa-plus"></i></button>
   <div class="exceprt">
      <!--excerpt-->
          <p>
            lorem ipsum dolor sit amet
          </p>

      <!--end-->
    </div>
    </div>
  </div
<!--endwhile-->

$( function() {
    // btn-ipsm
      function runEffect() {
         $( ".exceprt" ).toggle( "blind", 50 );
      };
      $( "#btn-1" ).on( "click", function() {

        runEffect();
    });
  });

ane pake jquery dan jquery ui gan.. ane buat code spt itu ketika #btn-1 di klik semua elemen dengan nama .exceprt yang di ekseksui gan.. nah untuk menselec sebuah elemen di jqueri itu bisa pake $(this) ya gan..? mohon bantuan nya gan,, semoga paham maksud ane :D

jquery

@arepsv

100 Kontribusi 64 Poin

Diperbarui 7 tahun yang lalu

4 Jawaban:

Selector buttonnya g salah ketik? Bukannya #btn-ipsm?

$("#btn-ipsm").on("click", function(){
  var target = $(this).siblings(".exceprt");
  runEffect(target);
});

Modif juga function runEffectnya menjadi:

function runEffect(target){
   $(target).toggle.("bind", 50);
}

Sebenarnya bisa dicut tanpa pake function di atas.

... // on click btn-ipsm
$(this).siblings(".exceprt").toggle("bind", 50);
...

@onirusama

265 Kontribusi 184 Poin

Dipost 7 tahun yang lalu

@onirusama makasi gan udah bantu jawab.. pake kode diatas emangsih work..

$(function(){
  function runEffect(target){
   $(target).toggle("bind", 50);
    };
    $("#btn-ipsm").on("click", function(){
      var target = $(this).siblings(".exceprt");
      runEffect(target);
    });
  });

tapi pas di klik #btn-ipsm nya gak bisa toggle dia gan.. terus ane conlose log muncul ini gan.. and #btn-ipsm yang ke loop yang laen gk work gan // siblings itu guna nya apa gan..?

@arepsv

100 Kontribusi 64 Poin

Dipost 7 tahun yang lalu

Jawaban Terpilih

coba rapiin lagi kodenya gan jadikan gini aja: *note salah ketik "bind" semestinya blind di kode yg sy tulis tadi

// kodenya ingin kita gunakan setelah halaman/element2nya ready.
// kalau belum buat begini, silahkan ditambahkan. tapi kalau sudah abaikan.
$(document).ready(function(){
   // kode agan dimulai dari sini
   // buat fungsi runEffect
   function runEffect(target){
      $(target).toggle('blind', 50);
   }

   // runeffect saat tombol diklik
   $(".btn-ipsm").on('click', function(){
      var target = $(this).siblings('.exceprt');
      runEffect(target);
   });
});

NOTE: - sebaiknya selector btn-ipsm dirubah aja dari id menjadi class id="btn-ipsm" ganti jadi class="btn-ipsm", karena sesuai fungsinya id kita gunakan untuk hal yg berbeda dengan yg lain, class untuk digunakan bersama. Walaupun memang kenyataannya dalam beberapa kasus di js ini masih bisa work. Kita ubah agar dilain waktu kita bisa gunakan class yg sama mungkin dalam hal styling di css. - siblings gunanya untuk select saudara dari selector saat ini

// p, div, dan ul adalah siblings/saudara jadi kalau selector saat ini p maka:
// $('p').click(function(){
//    $(this).siblings('div');
//    $(this).siblings('ul');
// });
<p>1</p>
<div>2</div>
<ul>3</ul>

silahkan dipelajari lebih lanjut.

@onirusama

265 Kontribusi 184 Poin

Dipost 7 tahun yang lalu

makasih gan.. nyelip 1 huruf di bind nya jadi gak work.. id btn juga udah di ganti pake class.. thanks Ya :D

@arepsv

100 Kontribusi 64 Poin

Dipost 7 tahun yang lalu