demo

Question

有人能告诉我如何使用此代码在DIV之间 显示和隐藏 数据（不隐藏和显示 - 我想要另一种方式）？

我在.js文件中使用：

function toggle(sDivId) {
                var oDiv = document.getElementById(sDivId);
                oDiv.style.display = (oDiv.style.display == "none") ? "block" : "none";
}

在.php文件中：

<div onclick="toggle('divContent1')" style="cursor: pointer;">Hide and show</div>
    <div id="divContent1">
    text here
    </div>
</div>

此代码工作得很好但是当页面加载时我希望已经隐藏了文本（而不是在我点击“隐藏和显示”文本之后）。

谢谢！

Answer 1

您可以使用您拥有的代码，但只需在css中添加display:none;即可。或者在style="display:none;"

中的php中

<div onclick="toggle('divContent1')" style="cursor: pointer;">Hide and show</div>
    <div id="divContent1" style="display:none;">
    text here
    </div>
</div>

jQuery还有一个你可以使用的toogle()函数。

demo

Answer 2

我可能误解了你的问题，但如果你想隐藏在页面加载的文字，你不能只是粘贴display：none标签，如下所示：

<div id="divContent1" style="display: none">
text here
</div>

Answer 3

$('#clickMe').click(function(){
 $('#divContent1').toggle();

}）;

Fiddle Demo

Answer 4

您提供的代码不是使用jquery。如果你想使用jquery这样做，你可以改变这样的事情。

function toggle(sDivId) {
    $("#"+sDivId).toggle();
}

并且你的php块你想要添加display：none;最初隐藏内部div

<div onclick="toggle('divContent1')" style="cursor: pointer;">Hide and show</div>
    <div id="divContent1" style='display:none'>
    text here
    </div>
</div>

Answer 5

您可以使用toggle（）函数在show（）和hide（）之间切换。否则，请直接使用show（）和hide（）函数。

Answer 6

在正文的onload事件中调用函数toggle('divContent1')

<body onload="toggle('divContent1')">

Answer 7

使用此代码：

function load(){
   document.getElementByID('divContent1').style.display = 'none';
}

并在你的HTML中

<body onLoad = "load()">

使用block / none显示/隐藏jquery

7 个答案:

demo