jQuery：选择父div之外的下一个div答案

【问题标题】：jQuery: select next div outside of parent divjQuery：选择父div之外的下一个div
【发布时间】：2012-07-21 05:25:57
【问题描述】：

好的，我觉得我错过了一些非常简单的东西，但是这里是：

这段代码效果很好，完全符合我的要求。点击链接，就会显示下一个 div（一个页面上大约有 10 个）

    $('a.addtask').click(function(){
      $(this).next('.field').slideToggle();
    return false;
    });

  <div class="field">
   Some content
  </div>

  <a href="#" class="addtask">Add a task</a>

  <div class="field" style="display:none;">
    some other content
  </div>

但是我想做的是像这样更改 HTML（div 内的链接）：

<div class="field">
   Some content
   <a href="#" class="addtask">Add a task</a>
  </div>


  <div class="field" style="display:none;">
    some other content
  </div>

^^这不再正常工作了。

我需要在我的 jquery 中进行哪些更改才能使其正常工作？我已经在谷歌上搜索了一段时间，类似帖子中的许多解决方案似乎都不起作用。

【问题讨论】：

标签： javascript jquery next

【解决方案1】：

$(".addtask").parent().next(".field") 应该可以工作

【讨论】：

【解决方案2】：

试试这个：$(".addtask").nextAll('.field').first()

【讨论】：

在回答老问题时请注意多个答案，尤其是当一个答案已被接受时。您需要解释为什么您的答案比其他现有帖子更好。

【解决方案3】：

我已经为上述问题完成了完整的垃圾箱。

演示： http://codebins.com/bin/4ldqp9y

HTML：

<div class="field">
  Some content
  <a href="#" class="addtask">
    Add a task
  </a>
</div>
<div class="field" style="display:none;">
  some other content
</div>

CSS：

.field{
  padding:7px;
  border:1px solid #4455f9;
  background:#74cca9;
}

jQuery：

$(function() {
    $('a.addtask').click(function() {
        $(this).closest('.field').next('.field').slideToggle();
        return false;
    });

});

【讨论】：