[英]Jquery Div Element Hide
I have a div (main div) which contains several div elements(sub divs). 我有一个div(主div),其中包含几个div元素(子div)。 I want to hide all inside div elements using Jquery. 我想使用Jquery隐藏所有内部div元素。 Can any body help me. 有谁能够帮助我。 But main div should display always. 但是main div应该始终显示。
Should be easy as: 应该很容易,因为:
$('#mainDiv > div').hide();
to hide only all direct children from #mainDiv
or 只隐藏#mainDiv
所有直接#mainDiv
或
$('#mainDiv div').hide();
to hide any descendant div of #mainDiv
. 隐藏#mainDiv
任何后代div。
Try this way,works fine 尝试这种方式,可以正常工作
<div style="text-align:center;background-color: lightblue;">Main div
<button id="checkButton"type="button" class="btn btn-primary">Check</button>
<div id="subdiv1" hidden>Sub Div 1</div>
<div id="subdiv2" hidden>Sub Div 2</div>
<div id="subdiv3" hidden>Sub Div 3</div>
<div id="subdiv4" hidden>Sub Div 4</div>
<div id="subdiv5" hidden>Sub Div 5</div>
</div>
<script>
$(document).ready(function(){
$("#checkButton").click(function(){
$("#subdiv1").toggle();
$("#subdiv2").toggle();
$("#subdiv3").toggle();
$("#subdiv4").toggle();
$("#subdiv5").toggle();
});
});
</script>
and also you can animate the hiding like this: 也可以像这样为隐藏动画:
$('#mainDiv div').slideUp();
$('#mainDiv div').slideToggle();
$('#mainDiv div').fadeToggle();
these are simple jquery animations. 这些是简单的jquery动画。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.