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

Question

好的，我感觉我可能错过了一些非常简单的东西，但是还是试试看：

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

    $('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代码才能使其正常工作吗？我已经搜索了一段时间，类似帖子中的一些解决方案似乎都不起作用。

- Clayton Correia

Answer 1

"

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

"

- Naren

Answer 2

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

- Alexey Kalinin

---

请注意，当回答旧问题时，尤其是已有被采纳的答案时，请解释为什么您的答案比其他现有帖子更好。 - APC

Answer 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;
    });

});

- gaurang171