Question

我正在尝试做一些常规点击功能，我必须在点击元素之外找到一个元素。这是一些代码：

<div class="options">
    <span class='comment_now'>kommentér</span>
</div>

<div class="write_comment_wrap">
    <form method="post" class="write_comment_form">
        <textarea class="write_comment" name="write_comment" placeholder="skriv din kommentar..."></textarea>
        <input type="submit" value="skriv" class="global_button">
    </form>
</div>

JS：

$('.comment_now').click(function(){
    $(this).closest('.write_comment_wrap').slideToggle();
});

什么都没发生。我试图发出警报，以确定我是否在函数内部。我们，我正在使用错误的遍历功能。

Answer 1

尝试：

$('.comment_now').click(function(){
    $(this).closest('.options').next('.write_comment_wrap').slideToggle();
});

演示：http://jsfiddle.net/HwQLw/

Answer 2

.closest是在同一个dom树中找到最接近的元素，但在您的情况下，.write_comment_wrap是.comment_now span的父级的兄弟。

$('.comment_now').click(function(){
    $(this).parent().next('.write_comment_wrap').slideToggle();
});

Answer 3

试试这个：

$('.comment_now').click(function(){
    $(this).parent().next('.write_comment_wrap').slideToggle();
});

http://jsfiddle.net/dcVqf/

Answer 4

closest向上遍历DOM树。 .comments_now的DOM树是：

   - body, etc.
     - .options
       - .comments_now

所以$(this).closest('.write_comment_wrap')找不到任何内容，因为.comments_now没有这样的祖先。

你可以做的是：

 $(this).closest('.options').next('.write_comment_wrap').slideToggle();

jQuery - 找到一个可以解决问题的元素

4 个答案: