Question

我想创建一个网络应用程序，其中我有多个页面我想要当我点击任何链接它应该移动到该页面我从网站得到的代码它工作正常但我希望它不显示像显示Page1页面，但没有onclick功能没有使用ancchor标签的java脚本

     <html>
     <head>
      <script>
     function show(shown, hidden) {
     document.getElementById(shown).style.display='block';
      document.getElementById(hidden).style.display='none';
     return false;
     }
    </script>
    </head>
   <body>


   <div id="Page1">
     Content of page 1
     <a href="#" onclick="return show('Page2','Page1');">Show page 2</a>
    </div>

    <div id="Page2" style="display:none">
    Content of page 2
     <a href="#" onclick="return show('Page1','Page2');">Show page 1</a>
    </div>

   </body>
   </html>

Answer 1

您可以使用CSS和复选框来获取此SITE上所写的行为。

该复选框是唯一具有两种不同状态的HTML元素，可以通过:checked属性由CSS导出/评估。

引自http://www.inserthtml.com/2012/04/css-click-states/：
HTML：

<form class="clickable"> 
  <label for="the-checkbox">Click Me!</label>
  <input type="checkbox" id="the-checkbox" /> 
  <!-- This is the div we want to appear and disappear -->
  <div class="appear">Some text to appear</div>
</form>

CSS：

.clickable .appear { 
  display: none;
}

.clickable input:checked ~ .appear {
  display: block;
}

查看该页面底部的演示。

要在两个以上的页面中进行选择，您可以使用单选按钮。没有经过测试，只是作为一个想法;）

如何在单个html文件中添加多个页面

1 个答案: