如何顯示所有子節點中jQuery的

<a href="javascript:(void);" id="lnkP">show all children</a> 
<a href="javascript:(void);" id="lnkC1">hide child 1</a> 
<a href="javascript:(void);" id="lnkC2">hide child 2</a> 

<div id="p" style="display:none;"> 
<div id="c1">child 1</div> 
<div id="c2">child 1</div>... 
</div> 

$("#lnkP").click(function(){ 
    $("#p").children().show(); //seems there's a problem here... 
}); 
$("#lnkC1").click(function(){ 
    $("#c1").hide(); 
}); 
$("#lnkC2").click(function(){ 
    $("#c2").hide(); 
});

的jsfiddle：http://jsfiddle.net/CBGsF/1/如何顯示所有子節點中jQuery的

我所試圖做的是：

p是一個父容器
點擊show all children鏈接，顯示 所有子divp
點擊lnkC1或lnkC2隱藏孩子個體格

但似乎我沒有得到.children()正常工作。那麼如何解決它？有任何想法嗎？謝謝。

編輯：我以爲.children()也會搜索不可見的節點。那麼，我錯了。感謝大家的快速回復。欣賞它。

來源

2012-12-07 woodykiddy

作爲jQuery選擇基本上是CSS選擇一些其他自定義的東西，所以將這項工作？ http://stackoverflow.com/questions/4910077/select-all-child-elements –

由於母公司（#p你的情況）有一個display:none，這孩子將不可見。

你需要顯示父第一，

$("#p") 
.show() 
.children().show();

（jQuery的鏈接，非常有用）

請嘗試擺脫內嵌樣式的（它一段時間後變得難以管理），儘可能多地使用類。

你可以有一個類中的CSS，

.displayNone 
{ 
    display: none; 
} 
.displayBlock 
{ 
    display: block; 
}

然後使用jQuery方法.removeClass()，.addClass()或.toggleClass()顯示/隱藏元素。

這僅僅是一個建議:)

測試環節：http://jsfiddle.net/CBGsF/8/

來源

2012-12-07 04:50:05

更新小提琴：http://jsfiddle.net/CBGsF/5/

$("#lnkP").click(function(){ 
$("#p").show(); 
$("#p").children().show(); 
}); 
    $("#lnkC1").click(function(){ 
    $("#c1").hide(); 
}); 
$("#lnkC2").click(function(){ 
    $("#c2").hide(); 
});

來源

2012-12-07 04:47:33 Anujith

父元素被設置爲「顯示」：「無」這就是問題所在

$("#p").css("display","block"); //is required in show all anchor click

檢查小提琴

http://jsfiddle.net/CBGsF/6/

謝謝

來源

2012-12-07 04:47:34

你需要顯示#p也

更新小提琴：http://jsfiddle.net/CBGsF/7/

$("#lnkP").click(function(){ 
    $("#p").show().children().show(); //Add show() before children.show call 
}); 
$("#lnkC1").click(function(){ 
    $("#c1").hide(); 
}); 
$("#lnkC2").click(function(){ 
    $("#c2").hide(); 
});

來源

2012-12-07 04:48:17 KingKongFrog

如何顯示所有子節點中jQuery的

回答

相關問題