`
rubyol
  • 浏览: 141491 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Mozilla Firefox中执行JS脚本style.display=block的问题

    博客分类:
  • JAVA
阅读更多
菜单显示页,代码如下:
<html>
<head>
<title>display</title>
<script type="text/javascript">
<!--
    function show(id){
        var msg=document.getElementById("submenu"+id);
        if(msg.style.display=="none")
            msg.style.display="block";
        else
            msg.style.display="none";
    }
//-->
</script>
</head>
<body>
<table width="100%" >
    <tr width="100%">
        <td width="100%">
            <font style="cursor:hand;" onclick="show(1)">
                菜单一
            </font>
        </td>
    </tr>
    <tr id="submenu1" style="display:none;">
        <td>
            <table>
                <tr>
                    <td>子菜单a</td>
                </tr>
                <tr>
                    <td>子菜单b</td>
                </tr>
            </table>
        </td>
    </tr>
    <tr width="100%">
        <td width="100%">
            <font style="cursor:hand;" onclick="show(2)">
                菜单二
            </font>
        </td>
    </tr>
    <tr id="submenu2" style="display:none;">
        <td>
            <table>
                <tr>
                    <td>子菜单c</td>
                </tr>
                <tr>
                    <td>子菜单d</td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
<html>

问题:
在Firefox中执行后"display:none;"没有回收"display:block;"开辟的页面空间,
下次再执行"display:block;"又会在页面上重新创建显示空间。


原因:
The reason it "appears" to work with IE is probably because IE is
error-correcting the display property for you.As others have implied,
IE has no concept of the table-row value. In fact,Microsoft's documentation
(<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp>)
clearly states that all block-like elements (with a few exceptions) have
'block' as their display value, contrary to specification.


解决:
将代码
msg.style.display="block";
修改为
msg.style.display="";
分享到:
评论
1 楼 feilian09 2013-06-20  

相关推荐

Global site tag (gtag.js) - Google Analytics