Question

可能重复：
HTML and JavaScript

在不同浏览器中显示有问题。它在IE8中表现很好，但在Firefox中却没有。我想做的是，
a）我想按下彩色标题更改显示框。 b）我什么时候按表中的深绿色标题，它应该显示“注册状态”， c）我什么时候按表中的深红色标题，它应该显示“登录入口”。

注意：在Firefox中，它没有以正确的格式显示。每种颜色都是大块的。在IE8中，它显示效果很好。

对于所有观众，请复制以下代码，粘贴在记事本中，以HTML格式保存，并在IE8和Firefox中测试。请帮助我在所有浏览器中兼容（特别是在IE8和Firefox中）。应该在两个浏览器中显示相同。

<html>   
  <head>   
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>   
    <title>HOME</title>   
    <script type="text/javascript">   
      function change1(){   
        document.getElementById('id1').style.display='block'   
        document.getElementById('id2').style.display='none'   
        document.getElementById('id3').style.display='block'   
        document.getElementById('id4').style.display='none'   
        document.getElementById('body1').style.display='block'   
        document.getElementById('body2').style.display='none'   
      }   
      function change2(){   
        document.getElementById('id1').style.display='none'   
        document.getElementById('id2').style.display='block'   
        document.getElementById('id3').style.display='none'     
        document.getElementById('id4').style.display='block'     
        document.getElementById('body1').style.display='none'     
        document.getElementById('body2').style.display='block' 
      }   
    </script>   
    <!-- end of "enter" key handling functions. -->   
  </head>   
 <body>  
<form method="POST" action="home_page.php" name="home_page">   
  <table width="320" height="200" border="1">   
    <tr style="width:315px;" align="center">   
    <td align="center" bgcolor="#C6FDBD" style="background-repeat:no-repeat;"width="155" height="28" id="id1" onClick="change1()"></td>   
    <td align="center" bgcolor="#04C80A" style="background-repeat:no-repeat; display:none;" width="155" height="28" id="id2" onClick="change1()"></td>   
    <td align="center" bgcolor="#DF1E02" style="background-repeat:no-repeat;" width="155" height="28" id="id3" onClick="change2()"></td>   
    <td align="center" bgcolor="#FF998A" style="background-repeat:no-repeat; display:none;" width="155" height="28" id="id4" onClick="change2()"></td>   
    </tr>   
    <tr>   
    <td colspan="2" id="body1">   
    <table width="318" height="44" border="0">   
    <tr>   
    <td width="318" height="40" align="center">   
    <span class="loginstyle3">Registration Status</span>   
    </td>   
    </tr>   
    </table></td>   
    <td colspan="2" id="body2" style="display:none;">   
    <table width="318" height="45" border="0">   
    <tr>   
    <td width="107" height="41" align="center" background="images/glossy1grey.gif">   
    <span class="loginstyle3">Login Entry </span>   
    </td>   
    </tr>   
    </table>   
    </td>   
    </tr>   
  </table>   
<!-- below block of code is to set login page after login attempt and failed -->   
<script type="text/javascript">change2()</script>   
</form>   
</body>   
</html>

用浏览器改变设计

0 个答案: