jQuery parent()。find()问题

时间:2011-05-12 02:12:20

标签: jquery jquery-selectors slidetoggle

HTML

<div class="comments">
    <a class="toggle" href="#">Toggle Comment 1</a><br />
    <div class="comment" style="display:none;">
        Comment1
    </div>
    <hr />
    <a class="toggle" href="#">Toggle Comment 2</a><br />
    <div class="comment" style="display:none;">
        Comment2
    </div>
</div>

的JavaScript

$(function(){
    $('.toggle').click(function() {
        $(this).parent().find('.comment').slideToggle();
        return false;
    });
});

可在此处查看:http://jsfiddle.net/saiprex/ESM4m/

我如何切换comment被点击的而不是全部?

干杯, PAV

2 个答案:

答案 0 :(得分:13)

$(function(){
    $('.toggle').click(function() {
        $(this).nextAll('.comment:first').slideToggle();
        return false;
    });
});

jsFiddle

答案 1 :(得分:0)

我认为,当你清理你的html时,它更简单: (避免br)

http://jsfiddle.net/ESM4m/27/

<div class="comments">
    <a class="toggle" href="Fork#">toggle</a>
    <div class="comment" style="display:none;">
        Comment1
    </div>
    <hr />
    <a class="toggle" href="#">toggle</a>
    <div class="comment" style="display:none;">
        Comment2
    </div>
</div>




$(function(){
    $('.toggle').click(function() {
        $(this).next().slideToggle();
        return false;
    }); 
});