pętla w jquerry

Question

ma skrypt nie za ładny ale to moje początki z jquery :)
proszę o podopowiedź jak wstawić pętle for aby nie powielać kodu?

 

<script>
$(document).ready(function(){
  $("[name=tab_sklep]").hide(); 
    $("#show1").click(function(nr_t){
       $("[name=tab_sklep]").hide();
       $("#d1").show();
    });

    $("#show2").click(function(nr_t){
       $("[name=tab_sklep]").hide();
       $("#d2").show();
    });

    $("#show3").click(function(nr_t){
       $("[name=tab_sklep]").hide();
       $("#d3").show();
    });



});
</script>

<a href="#" id="show1">1</a>
<a href="#" id="show2">2</a>
<a href="#" id="show3">3</a>

<div id="d1" name="tab_sklep">1</div>
<div id="d2" name="tab_sklep">2</div>
<div id="d3" name="tab_sklep">3</div>

 

Answer 1

Skoro te linki odnoszą się do konkretnych elementów, to niech mają to w [href]. Wówczas da się napisać uniwersalną funkcję do obsługi linków. Dodatkowo proponuję zamiast [name] klasę dla tych divów

<script>
$(document).ready(function(){
  $(".tab").hide(); 

    $(".tab-toggle").click(function(e){
       e.preventDefault();
       $(".tab").hide();
       $($(this).attr('href')).show();
    });
 
 
});
</script>
 
<a href="#d1" class="tab-toggle">1</a>
<a href="#d2" class="tab-toggle">2</a>
<a href="#d3" class="tab-toggle" >3</a>
 
<div id="d1" class="tab">1</div>
<div id="d2" class="tab">2</div>
<div id="d3" class="tab">3</div>

 

Comments

wielki dzięki ;)