1

複数のページがある Web アプリを作成したい リンクをクリックするとそのページに移動するようにしたい サイトからコードを取得しても問題なく動作しますが、ショー Page1 ページのように表示されないようにしたいですただし、アンカータグを使用するJavaスクリプトを使用せずにonclick関数を使用しない

     <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>
4

1 に答える 1

1

CSS とチェックボックスを使用して、このSITEに書かれているような動作を得ることができます。

:checkedチェックボックスは、プロパティを介して CSS によってエクスポート/評価できる 2 つの異なる状態を持つ唯一の HTML 要素です。

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;
}

そのページの下部にあるデモをチェックしてください。

2 つ以上のページから選択するには、ラジオ ボタンを使用できます。アイデアとして、テストされていません;）

于 2012-10-16T07:42:37.043 に答える