frameset在Google Chrome中无法隐藏左边栏怎么办
更新:HHH   时间:2023-1-7


frameset在Google Chrome中无法隐藏左边栏怎么办?这个问题可能是我们日常学习或工作经常见到的。希望通过这个问题能让你收获颇深。下面是小编给大家带来的参考内容,让我们一起来看看吧!

使用Frameset 框架,发现在IE下,

<frameset name="mainDefine" cols="200,10,*" frameborder="NO"  border="0" framespacing="0" rows="*">
      <frame name="LeftFrame" noresize scrolling="auto" src="<%= PageTitle %>" >
      <frame name="middleFrame" scrolling="NO" noresize src="switchBar.html">
      <frame name="mainFrame" id ="mainFrame" scrolling="auto" noresize src="AddTabs.aspx">
</frameset>
switchBar.html 页面中,可以使用js 控制左边栏的显示、隐藏
function oa_tool() {
            if (window.parent.mainDefine.cols == "0,10,*") {
                frameshow.src = "p_1.gif";
                oa_tree.title = "隐藏工具栏"
                window.parent.mainDefine.cols = "200,10,*";
            }
            else {
                frameshow.src = "p_2.gif";
                oa_tree.title = "显示工具栏"
                window.parent.mainDefine.cols = "0,10,*";
            }
        }
<p id="oa_tree" onclick="oa_tool();" title="隐藏工具栏"><br>
         <img id="frameshow" src="p_1.gif">
</p>

但是在 Google Chrome 中,会报错情况 :

无法读取cols属性。

解决方案:

<frameset id="mainDefine" name="mainDefine" cols="200,10,*" frameborder="NO"  border="0" framespacing="0" rows="*">
      <frame name="LeftFrame" noresize scrolling="auto" src="<%= PageTitle %>" >
      <frame name="middleFrame" scrolling="NO" noresize src="switchBar.html">
      <frame name="mainFrame" id ="mainFrame" scrolling="auto" noresize src="AddTabs.aspx">
</frameset>

Frameset 添加ID,在JS中 使用 document.getElementById 来获取ID 的 cols

if (parent.document.getElementById('mainDefine').cols == "0,10,*") {
       frameshow.src = "p_1.gif";
       oa_tree.title = "隐藏工具栏"
       parent.document.getElementById('mainDefine').cols = "200,10,*";
}
else {
     frameshow.src = "p_2.gif";
     oa_tree.title = "显示工具栏"
     parent.document.getElementById('mainDefine').cols = "0,10,*";
}

感谢各位的阅读!看完上述内容,你们对frameset在Google Chrome中无法隐藏左边栏怎么办大概了解了吗?希望文章内容对大家有所帮助。如果想了解更多相关文章内容,欢迎关注天达云行业资讯频道。

返回web开发教程...