我正在尝试这个简单的代码,但它仅适用于第1页和第2页,因为第3页显示空白。我找不到问题所在,请帮忙!

<div id="allTabs">
    <input type="button" value="Page 1" name="b1" onclick='change("page1");'/>
    <input type="button" value="Page 2" name="b2" onclick='change("page2");' />
    <input type="button" value="Page 3" name="b3" onclick='change("page3");' />

    <div id="page1" >This is page 1 </div>
    <div id="page2" style="display: none"> This is page 2 </div>
    <div id="page3" style="display: none"> This is page 3 </div>
</div>
<script type="text/javascript">

     function change(pageId) {
          var f=document.getElementById('page1');
          var h=document.getElementById('page2');
          var k=document.getElementById('page3')

          if(pageId=="page1") {
                f.style.display= 'block';
                h.style.display= 'none';
                k.style.diplay= 'none';
          }
         if(pageId=="page2") {
                f.style.display= 'none';
                h.style.display= 'block';
                k.style.diplay= 'none';
          }
         if(pageId=="page3") {
                f.style.display= 'none';
                h.style.display= 'none';
                k.style.diplay= 'block';
          }
      }
</script>

最佳答案

您在第三条件中将display拼写错误为diplay时打错了拼写

function change(pageId) {
          var f=document.getElementById('page1');
          var h=document.getElementById('page2');
          var k=document.getElementById('page3');

          if(pageId=="page1") {
                f.style.display= 'block';
                h.style.display= 'none';
                k.style.diplay= 'none';
          }
         if(pageId=="page2") {
                f.style.display= 'none';
                h.style.display= 'block';
                k.style.display= 'none';
          }
  debugger;
         if(pageId=="page3") {
                f.style.display= 'none';
                h.style.display= 'none';
                k.style.display= 'block';
          }
      }
<div id="allTabs">
    <input type="button" value="Page 1" name="b1" onclick='change("page1");'/>
    <input type="button" value="Page 2" name="b2" onclick='change("page2");' />
    <input type="button" value="Page 3" name="b3" onclick='change("page3");' />

    <div id="page1" >This is page 1 </div>
    <div id="page2" style="display: none"> This is page 2 </div>
    <div id="page3" style="display: none"> This is page 3 </div>
</div>

10-07 19:06
查看更多