javascript - jQuery - 针对兄弟姐妹、父母、后代和其他家庭动物

Question

我有一个小标记测试来切换 div 。

一个（工作）模型可以在这里找到：http: //jsfiddle.net/obmerk99/d78aF/1/

问题是，我需要将隐藏/显示链接放在另一个 div 中，如下所示：

http://jsfiddle.net/obmerk99/d78aF/2/

.. 当我移动它时，它对我的​​所有努力都不起作用。

我试过了 ：

jQuery(this).next().next('.toggle').toggle('slow');

和

jQuery(this).next('.toggle').toggle('slow');

还有许多其他人，但这只是反复试验-而我想了解这个家庭的东西（我想我不是一个家庭的人是潜意识的；影响我的编码能力:-)）

说到理解，在我的一次试验和错误中，我做了这个：

http://jsfiddle.net/obmerk99/d78aF/5/

这是行不通的，但是突然添加一个小的</br>使它起作用。

http://jsfiddle.net/obmerk99/d78aF/4/

空</br>标签是否被视为“兄弟”？

Answer 1

试试这个：http: //jsfiddle.net/d78aF/6/

jQuery(this).siblings('.toggle').toggle('slow');

根据您的评论，您可以这样做：http: //jsfiddle.net/d78aF/7/

jQuery(document).find('.toggle').toggle('slow');

新小提琴：http: //jsfiddle.net/d78aF/8/

Answer 2

空</br>标签是否被视为“兄弟”？

自己不试试怎么办？

<div id='firstEl'></div>
<br/>
<div></div>

<div id='siblings'></div>

然后在你的js代码中：

$(function(){
  $('#siblings').text($.makeArray($('#firstEl').siblings()).join(','));
});

结果：

[object HTMLBRElement],[object HTMLDivElement],[object HTMLDivElement]

您可以看到该<br/>元素被视为兄弟姐妹

http://jsfiddle.net/EP5bj/

http://api.jquery.com/siblings/

Answer 3

您可以考虑一种更有针对性的方法，在 HTML 标记中指定要隐藏的 div。这是许多包的常见做法，例如 jQuery Mobile。

http://jsfiddle.net/turiyag/R5sDr/

<p class="hider" for="banks">Hide the banks!</p>

$(".hider").click(function(e) {
    var id = $(this).attr("for");
    $("#" + id).hide("slow");
    log("Hiding #" + id);
});