谷歌内核浏览器 iframe内容的 tab切换滚动条消失

最新推荐文章于 2023-02-09 10:14:22 发布

转载最新推荐文章于 2023-02-09 10:14:22 发布 · 213 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/yigexiaojiangshi/p/8136667.html

文章标签：

#javascript #ViewUI

本文介绍了一种在使用-webkit-内核浏览器时，解决tab切换导致iframe内滚动条消失的问题的方法。通过调整iframe的高度来触发其重新渲染，进而使滚动条重新显示。

问题：

新版本的-webkit- 内核浏览器在tab切换时，iframe 内容区丢失滚动条

如下图

（虽然滚动条位置还在，可以垂直滚动，但滚动条不见了）

解决思路：

让iframe重新计算宽高，重新渲染

easyui的tab切换解决代码：

            $('#tabs').tabs({
                // border:false,
                onSelect: function () {
                    var iframe = $("#tabs>div:nth-child(2) iframe")
                    iframe.height("99%");
                   // console.log(iframe.height());
                    iframe.scrollWidth;
                    iframe.height("100%");
                }
                })

如下图