21

如何在 HTML iFrame 中检测滚动条的存在(使用 Javascript)?

我已经尝试过:

        var vHeight = 0;
        if (document.all) {
          if (document.documentElement) {
            vHeight = document.documentElement.clientHeight;
          } else {
            vHeight = document.body.clientHeight
          }
    } else {
      vHeight = window.innerHeight;
    }

    if (document.body.offsetHeight > vHeight) {
      //when theres a scrollbar
    }else{
      //when theres not a scrollbar
    }

我也试过:

           this.scrollLeft=1;
    if (this.scrollLeft>0) {
        //when theres a scrollbar
        this.scrollLeft=0;
        }else{
        //when theres not a scrollbar
        return false;
    }

没有成功..

我在DOM Inspector上搜索了javascript 对象,但没有找到任何东西。

是否可以在 javacscript 的 iframe 中检测到滚动条的存在?


iframe 内容来自同一个域。

到现在都没有成功。。

替代文字 http://www.upvtp.com.br/file.php/1/help_key.jpg

4

6 回答 6

45
var root= document.compatMode=='BackCompat'? document.body : document.documentElement;
var isVerticalScrollbar= root.scrollHeight>root.clientHeight;
var isHorizontalScrollbar= root.scrollWidth>root.clientWidth;

这会检测是否需要滚动条。对于 iframe 的默认设置,这与是否有滚动条相同但如果滚动条被强制打开或关闭(使用父文档中的 'scrolling="yes"/"no"' 属性,或 CSS 'overflow: scroll /hidden' 在 iframe 文档中)那么这可能会有所不同。

于 2009-03-25T14:03:29.283 回答
9

使用 jQuery,您可以比较文档高度、scrollTop 位置和视口高度,这可能会为您提供所需的答案。

类似于以下内容:

$(window).scroll(function(){
  if(isMyStuffScrolling()){
    //There is a scroll bar here!
  }
}); 

function isMyStuffScrolling() {
  var docHeight = $(document).height();
  var scroll    = $(window).height() + $(window).scrollTop();
  return (docHeight == scroll);
} 
于 2009-03-25T11:04:19.853 回答
3
$(window).scroll(function(){
  if(isMyStuffScrolling()){
//scrolling
  }else{
//not scrolling
}
}); 

function isMyStuffScrolling() {
  var docHeight = $(document).height();
  var scroll    = $(window).height() ;//+ $(window).scrollTop();
  if(docHeight > scroll) return true;
  else return false;
}

改进了乔恩的温斯坦利代码

于 2010-08-19T00:33:28.207 回答
1

由于 JavaScript 安全限制,如果 iframe 内容来自另一个域,我认为无法做到这一点。

编辑:在这种情况下,给 iframe 一个 name='someframe' 和 id='someframe2' 然后比较 frames['someframe'].document.body.offsetWidth 与 document.getElementById('someframe2') .offsetWidth 应该会给你答案。

于 2009-03-25T11:24:31.960 回答
1

我发现这适用于任何元素,至少在 Chrome 上:

hasVerticalScrollbar = (element.scrollHeight > element.offsetHeight)
        || 
(element.scrollHeight > element.clientHeight

水平滚动条也可以被检测到,使用Width代替Height.

于 2018-01-04T10:27:41.453 回答
0

我认为你的第二次尝试是在正确的轨道上。除了代替this,您应该尝试滚动/检查document.body

于 2009-03-26T07:12:26.737 回答