You Now Here »

Javascript jQuery Auto Hide toggle other ID when Click new show one div  (Read 977 times - 57 votes) 

DANNY

G-Plus Author
  • ADMINISTRATOR
  • More Share Forum Topic
  • [MS] kepala suku
  • *
  • DANNY sangat terkenal!DANNY sangat terkenal!DANNY sangat terkenal!DANNY sangat terkenal!DANNY sangat terkenal!DANNY sangat terkenal!
  • Rep Power: 6
  • Join: September 30, 2009
  • Posts: 11,931
  • Poin: 194.149
    • WWW
  • IP member tracker Logged


Rumus ini digunakan untuk meng-hide atau menyembunyikan secara otomatis data yang telah ditampilkan jika button DIV di click.

Sample:
Button DIV1 -> click -> Result DIV1 -> Hide Result DIV2,3,4,5...
Button DIV2 -> click -> Result DIV2 -> Hide Result DIV1,3,4,5...
.......

Code: [Select]
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>


<script> $(document).ready(function(){
$("span").click(function(e){ $('[id^="r">').not($('#r'+$(this).attr('id')+'')).hide(); $('#r'+$(this).attr('id')+'').show() });
}); </script>

<span id="1open">R1</span>
<span id="2open">R2</span>
<span id="3open">R3</span>
<span id="4open">R4</span>
<span id="5open">R5</span>

<div style="display:none" class="hide_show" id="r1open">R11111</div>
<div style="display:none" class="hide_show" id="r2open">R22222</div>
<div style="display:none" class="hide_show" id="r3open">R33333</div>
<div style="display:none" class="hide_show" id="r4open">R44444</div>
<div style="display:none" class="hide_show" id="r5open">R55555</div>





View Mobile Web Short URL: