Question

我{m} following this example创建一段文字，点击后会展开/折叠文字。

如何设置隐藏的初始值，以便最初折叠段落，点击后会展开？

以下是代码。

＆＃13;

div#expand {
  width: 500px 
  display:none;
}

＆＃13;

<html lang="en">

<head>
  <meta charset="utf-8">
  <script>
    function show() {
      if (document.getElementById('expand').style.display == 'none')
        document.getElementById('expand').style.display = 'block';
      else
        document.getElementById('expand').style.display = 'none';
    }
  </script>
</head>

<body>
  <p>
    <a href="javascript:;" onclick=show()>About Us</a>
    <div id="expand">
      <p>this is all about us. <br></p>
    </div>
  </p>
</body>

</html>

＆＃13;

Fiddle Link

Answer 1

document.getElementById('expand').style将检查不是来自css文件的内联书面样式...因此，请尝试将内联css display:none;写入该元素。

此外，您无法在另一个<p>代码中对<p>代码进行编码...其无效。

此外，您在css中;之后错过了width:500px

＆＃13;

function show() {
  if (document.getElementById('expand').style.display == 'none')
    document.getElementById('expand').style.display = 'block';
  else
    document.getElementById('expand').style.display = 'none';
}

＆＃13;

div#expand {
  width: 500px;
}

＆＃13;

<a href="javascript:void(0)" onclick=show()>About Us</a>
<div id="expand" style="display:none;">
  <p>this is all about us.<br></p>
</div>

＆＃13;

如何将初始值设置为＆＃39; Hidden＆＃39;

1 个答案: