[英]jQuery ,Css display none - block vs. hide- show
I am trying to hide #showMyList, #showMyName these divs.我正在尝试隐藏#showMyList、#showMyName 这些 div。 On click button need to show divs.单击按钮需要显示 div。 Both div has separate buttons.两个 div 都有单独的按钮。 I want to see one div at a time.我想一次看到一个 div。 I can give different css (style)to them so that they will look different.我可以给他们不同的 css(风格),让他们看起来不同。
Which one will be more useful jQuery hide() and show() Or display none and block?哪个会更有用 jQuery hide() 和 show() 还是 display none 和 block?
#showMyList, #showMyName{
height: 100px;
width: 500px;
text-align: center;
border: 1px solid gray;
background-color: antiquewhite;
position: absolute;
top: 200px;
left:200px;
}
</style>
<script>
$('document').ready(function(){
$('showMyList').css("display", "none");
$('showMyAcc').css("display","none");
$("myList").click(function(){
$("showMyList").css("display", "block");
$("myAcc").click(function(){
$("showMyAcc").css("display", "block");
});
});
});
Consider the following example.考虑以下示例。
$(function() { $('#showMyList, #showMyAcc').hide(); $("#myList").click(function() { $("#showMyAcc").hide(); $("#showMyList").show(); }); $("#myAcc").click(function() { $("#showMyList").hide(); $("#showMyAcc").show(); }); });
#showMyList, #showMyAcc { height: 100px; width: 500px; text-align: center; border: 1px solid gray; background-color: antiquewhite; position: absolute; top: 200px; left: 200px; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button id="myList">Show List</button> <button id="myAcc">Show Name</button> <div id="showMyList">List</div> <div id="showMyAcc">Name</div>
You can Hide both elements and then reveal or show 1 at a time.您可以隐藏两个元素,然后一次显示或显示 1 个。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.