1

谁能告诉我如何使用此代码在 DIV`s 之间显示和隐藏数据(不隐藏和显示 - 我想要另一种方式)?

我在 .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>

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

谢谢!

4

7 回答 7

1

我可能误解了你的问题,但如果你想在页面加载时隐藏文本,你不能只粘贴一个 display:none 标签,如下所示:

<div id="divContent1" style="display: none">
text here
</div>
于 2013-09-21T18:04:25.740 回答
1
$('#clickMe').click(function(){
 $('#divContent1').toggle();

});

小提琴演示

于 2013-09-21T18:06:46.147 回答
1

您可以使用您拥有的代码,但只需添加display:none;css。或者在php里面style="display:none;"

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

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

演示

于 2013-09-21T18:01:28.320 回答
1

您提供的代码未使用 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>
于 2013-09-21T18:08:25.793 回答
0

您可以使用() 函数在() 和()toggle之间交替切换。否则,直接使用() 和() 函数。showhideshowhide

于 2013-09-21T18:03:36.693 回答
0

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

<body onload="toggle('divContent1')">
于 2013-09-21T18:07:43.900 回答
0

使用此代码:

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

在你的 html 中

<body onLoad = "load()">
于 2013-09-21T18:09:41.927 回答