Question

我是jQuery的新手，并设置了一个函数来切换div打开/关闭。效果很好。但我在页面上有6个地方需要它。所以想将id #show更改为传入的变量，我可以使用一个jQuery函数为6个div完成此操作。

<script>
$(function(){
$('.myClass').hide();
$('#show').toggle(function(){
$('.myClass').slideDown("fast"); 
$(this).attr("src","/images/minus.png" );
},function(){
$('.myClass').slideUp("fast"); 
$(this).attr("src", "/images/plus.png" );
});
}); 
</script>

<h2><img id="show" src="/images/plus.png"><span class="toggleText">DivisionI</span>    
</h2>
<div class="myClass">
my code to show....
</div>

Answer 1

<script>
$(function(){
    $('.myClass').hide();
    $('.show').toggle(function(){
        var showdiv = $(this).attr("id");
        $('.' + showdiv).slideDown("fast"); 
        $(this).attr("src","/images/minus.png" );
    },function(){
        var showdiv = $(this).attr("id");
        $('.' + showdiv).slideUp("fast"); 
        $(this).attr("src", "/images/plus.png" );
    });
}); 
</script>

<h2><img id="show1" class="show" src="/images/plus.png"><span class="toggleText">DivisionI</span>    
</h2>
<div class="show1 myclass">
my code to show....
</div>
<h2><img id="show2" class="show" src="/images/plus.png"><span class="toggleText">DivisionI</span>    
</h2>
<div class="show2 myclass">
my code to show....
</div>

Answer 2

您可以将jQuery对象传递给函数：

var toggleDiv = function($el){
    $el.slideDown();
    //blablabla
};

toggleDiv($('#el'));

JQuery，切换，传入一个变量

2 个答案: