jQuery 如何使切换默认隐藏
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10960753/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make toggle hidden by default
提问by Rayan Sp
Hello I would like to know how to make toggle hidden when the page loads, I have made a simple code, but when the page loads it will be shown by default. I want it the way around.
你好我想知道如何在页面加载时隐藏切换，我做了一个简单的代码，但是当页面加载时它会默认显示。我想要它的方式。
I have to tried to use CSS something like
我必须尝试使用 CSS 之类的东西
.hidden {
display:none;
}
when I use this code, the element doesn't show at all.
当我使用此代码时，该元素根本不显示。
this is my code
这是我的代码
EDITED
已编辑
<script type="text/javascript">
function toggleDiv(divId) {
$("#"+divId).toggle();
}
</script>
<a href="javascript:toggleDiv('myContent');">this is a test</a>
<div id="myContent">
<a href="javascript:toggleDiv('myContentt');"><span>this is a text</span></a>
<div>this is a test #2 </div>
</div>
<div id="myContentt">
test
</div>
please help.
请帮忙。
回答by Jashwant
I guess, you want something like this,
我想，你想要这样的东西，
Demo( I used onclickin demo because jsfiddle doesnt like javascript on href)
演示（我onclick在演示中使用，因为 jsfiddle 不喜欢 javascript href）
CSS:
CSS：
.hidden{
display:none;
}
Markup:
标记：
<a href="javascript:toggleDiv('myContent');">this is a test</a>
<div id="myContent" class='hidden'>
<div>this is a test #1 </div>
</div>
<br />
<a href="javascript:toggleDiv('myContentt');"><span>this is a text</span></a>
<div id="myContentt" class='hidden'>
this is a test #2
</div>
Javascript:
Javascript：
function toggleDiv(divId) {
$("#"+divId).toggle();
}
回答by Tom Walters
Use .toggleClass('hidden')to show and hide your elements.
使用.toggleClass('hidden')显示和隐藏元素。
回答by user3776913
Just add the
只需添加
$("your class").hide();
Example
例子
$(document).ready(function(){
$(".subResult").hide();
});
then you can define your function
function toggle(){
$(".subResult").slideToggle(2000);
}
Another Example
另一个例子
$(document).ready(function(){
$("p").hide();
$("button").click(function(){
$("p").toggle();
});
});
///////
///////
$("p").hide();This line hides your div on ready function.
$("p").hide();此行在就绪功能上隐藏您的 div。
回答by ADP
The key thing to understand with toggle() is that it simply toggles the CSS display attribute. Therefore, if you want to replace one element with another, simply make sure the element you want initially hidden has a style of display: none;. When you use the toggle() method, it will make the visible element hidden with a display: none;and will remove that attribute from the hidden element.
使用 toggle() 理解的关键是它只是切换 CSS 显示属性。因此，如果您想将一个元素替换为另一个元素，只需确保您最初想要隐藏的元素的样式为display: none;. 当您使用 toggle() 方法时，它将使用 a 隐藏可见元素display: none;，并将从隐藏元素中删除该属性。
