用jquery显示隐藏的div

Question

如果按下按钮，我想用jquery显示div内容。例如，

<button id="b1">Show text</button>

如果按下按钮，则显示此文本div。

<div id="text">hello world.</div>

我试过使用jquery函数“fadein”，“toggle”，“slidedown”..但是我有一个问题，默认情况下它会显示div内容。我希望它默认隐藏内容，并仅在单击按钮时显示。我怎么能这样做？如果可能的话，我将非常感谢您对一些基本示例的帮助。

Answer 1

将div的显示样式属性设置为'none'，无论是内联还是使用CSS类。

<!-- inline -->
<div id="text" style="display:none">hello world.</div>


// css class
#text { display: none; }

Answer 2

为div定义css规则：

div#text {
   display: none;
}

这将确保元素从一开始就是隐藏的。

示例：http://www.jsfiddle.net/GkFu4/5/

Answer 3

如果要使用切换，请参阅jQuery api。 http://api.jquery.com/toggle/ 或者另一个例子。 http://jsbin.com/obumi3/