代码之家 › 专栏 › 技术社区 › user279860

使用jquery单独切换DIV可见性

toggle html jquery

1

user279860 · 技术社区 · 16 年前

我有一个简单的jquery函数,它在单击时切换DIV的可见性。该函数的问题在于,它不能应用于同一页上的多个项目,或者它们都串联切换。有没有一种方法可以避免为每个实例分配一个唯一的类?

jQuery:

 $(function(){
    $(".toggleThis").click(function(){
         $(".hiddenText").slideToggle("fast");
            $(this).html(function(i,html) {
                if (html.indexOf('+') != -1 ){
                   html = html.replace('+','-');
                } else {
                   html = html.replace('-','+');
                }
                return html;
            })
    });
});

HTML:

<p class="toggleThis">Blah blah + <p>
<div class="hiddenText">
<p>Blah blah</p>
</div>

CSS:

.hiddenText {display: none;}

谢谢!

1 回复 | 直到 16 年前

1

3

Nick Craver 16 年前

而不是这个:

 $(".hiddenText").slideToggle("fast");

使用此:

 $(this).next(".hiddenText").slideToggle("fast");

此方法相对于单击的元素(使用 .next() )而不是全部 class="hiddenText" . 如果在这两个元素之间有您的示例中没有的元素,请使用 .nextAll(".hiddenText:first") 相反。