JQuery切换下一堂课

时间:2016-03-02 17:08:03

标签: javascript php jquery html show-hide

我正在创建一个博客网站,并希望在点击时有标题或链接显示帖子,我让它工作,所以当点击一个时它们都打开但我只想让它成为标题下面的那个

JQuery:

$(inherited)
-l"junit"

PHP:

$(document).ready(function(){

    $('.slidingDiv').hide();
    $('.show_hide').show();

    $('.show_hide').click(function(){
        $('.slidingDiv').slideToggle();
    });

});

提前致谢

2 个答案:

答案 0 :(得分:4)

您可以使用.next仅选择下一个.slidingDiv

$(this).next('.slidingDiv').slideToggle();

<强>段

&#13;
&#13;
$('.slidingDiv').hide();
$('.show_hide').show();

$('.show_hide').click(function() {
  $(this).next('.slidingDiv').slideToggle();
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href='#' class='show_hide'>Article name</a>
<div class='slidingDiv'>
  Fill this space with really interesting content.
</div>
<br>
<br>
<a href='#' class='show_hide'>Article name</a>
<div class='slidingDiv'>
  Fill this space with really interesting content.
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:-1)

您应该找到下一个.slidingDiv元素:

$(document).ready(function(){

    $('.slidingDiv').hide();
    $('.show_hide').show();

    $('.show_hide').click(function() {
        // 'this' is now the clicked .show_hide element
        $(this).next().slideToggle();
    });

});