这是我的改进:添加parseInt。出于某种奇怪的原因，没有它就不能工作。

// usage: jQuery('#my_div1').hasVerticalScrollBar();
// Credit: http://stackoverflow.com/questions/4814398/how-can-i-check-if-a-scrollbar-is-visible
(function($) {
    $.fn.hasVerticalScrollBar = function() {
        return this.get(0) ? parseInt( this.get(0).scrollHeight ) > parseInt( this.innerHeight() ) : false;
    };
})(jQuery);

(scrollWidth/Height - clientWidth/Height)是滚动条存在的一个很好的指示器，但在很多情况下它会给你一个“假阳性”的答案。 如果你需要精确，我建议使用下面的函数。 而不是试图猜测元素是否可滚动—您可以滚动它…

function isScrollable( el ){ var y1 = el.scrollTop; el.scrollTop += 1; var y2 = el.scrollTop; el.scrollTop -= 1; var y3 = el.scrollTop; el.scrollTop = y1; var x1 = el.scrollLeft; el.scrollLeft += 1; var x2 = el.scrollLeft; el.scrollLeft -= 1; var x3 = el.scrollLeft; el.scrollLeft = x1; return { horizontallyScrollable: x1 !== x2 || x2 !== x3, verticallyScrollable: y1 !== y2 || y2 !== y3 } } function check( id ){ alert( JSON.stringify( isScrollable( document.getElementById( id )))); } #outer1, #outer2, #outer3 { background-color: pink; overflow: auto; float: left; } #inner { width: 150px; height: 150px; } button { margin: 2em 0 0 1em; } <div id="outer1" style="width: 100px; height: 100px;"> <div id="inner"> <button onclick="check('outer1')">check if<br>scrollable</button> </div> </div> <div id="outer2" style="width: 200px; height: 100px;"> <div id="inner"> <button onclick="check('outer2')">check if<br>scrollable</button> </div> </div> <div id="outer3" style="width: 100px; height: 180px;"> <div id="inner"> <button onclick="check('outer3')">check if<br>scrollable</button> </div> </div>

上面的第一个解决方案只适用于IE 上述第二种解决方案仅适用于FF

这两个函数的组合在两种浏览器中都有效:

//Firefox Only!!
if ($(document).height() > $(window).height()) {
    // has scrollbar
    $("#mtc").addClass("AdjustOverflowWidth");
    alert('scrollbar present - Firefox');
} else {
    $("#mtc").removeClass("AdjustOverflowWidth");
}

//Internet Explorer Only!!
(function($) {
    $.fn.hasScrollBar = function() {
        return this.get(0).scrollHeight > this.innerHeight();
    }
})(jQuery);
if ($('#monitorWidth1').hasScrollBar()) {
    // has scrollbar
    $("#mtc").addClass("AdjustOverflowWidth");
    alert('scrollbar present - Internet Exploder');
} else {
    $("#mtc").removeClass("AdjustOverflowWidth");
}​

准备好文档 monitorWidth1:溢出设置为auto的div mtc: monitorWidth1中的容器div AdjustOverflowWidth:当滚动条激活时应用到#mtc div的css类 *使用警报测试跨浏览器，然后注释为最终的产品代码。

HTH

对于那些像我一样使用现代js框架而不是JQuery的可怜人，我将进一步扩展这一点，并被这个线程的人完全抛弃:

这是用Angular 6写的，但如果你写React 16、Vue 2、Polymer、Ionic、React- native，你就知道怎么去适应它了。这是整个组件，所以应该很简单。

import {ElementRef, AfterViewInit} from '@angular/core';

@Component({
  selector: 'app',
  templateUrl: './app.html',
  styleUrls: ['./app.scss']
})
export class App implements AfterViewInit {
scrollAmount;

constructor(
  private fb: FormBuilder,
  private element: ElementRef 
) {}

ngAfterViewInit(){
  this.scrollAmount = this.element.nativeElement.querySelector('.elem-list');
  this.scrollAmount.addEventListener('wheel', e => { //you can put () instead of e
  // but e is usefull if you require the deltaY amount.
    if(this.scrollAmount.scrollHeight > this.scrollAmount.offsetHeight){
       // there is a scroll bar, do something!
    }else{
       // there is NO scroll bar, do something!
    }
  });
}
}

在HTML中会有一个带有类“element -list”的div，它在CSS或SCSS中被风格化，具有不隐藏的高度和溢出值。(自动或滚动)

我在滚动事件时触发这个eval，因为我的最终目标是拥有“自动焦点滚动”，它决定是否在所述组件没有垂直滚动可用时水平滚动整个组件集，否则只垂直滚动其中一个组件的内部。

但是你可以把eval放在其他地方，让它被其他东西触发。

这里需要记住的重要一点是，你永远不会被迫重新使用JQuery，总有一种方法可以在不使用它的情况下访问它的相同功能。

我有一个问题，我需要检查，如果滚动条是可见的整个屏幕(主体)或不。Chrome有能力隐藏滚动条，尽管有一个溢出发生的事实，因此主体是可滚动的。

因此，上面的解决方案对我不起作用。我现在检查，如果有滚动条如下方式:

const isScrollbarPresent = () => {
    const beforeScrollbarHidden = document.body.clientWidth;
    const overflowState = document.body?.style.overflow;
    document.body.style.overflow = 'hidden';
    const afterScrollbarHidden = document.body.clientWidth;
    document.body.style.overflow = overflowState;
    return beforeScrollbarHidden !== afterScrollbarHidden;
};

我得到主体的宽度，有或没有滚动条，并保存主体的当前溢出状态。然后隐藏滚动条。如果有滚动条，主体的宽度现在会更大。如果不是，宽度是相同的。之后，我恢复溢出状态。

这扩展了@Reigel的回答。它将返回水平或垂直滚动条的答案。

(function($) {
    $.fn.hasScrollBar = function() {
        var e = this.get(0);
        return {
            vertical: e.scrollHeight > e.clientHeight,
            horizontal: e.scrollWidth > e.clientWidth
        };
    }
})(jQuery);

例子:

element.hasScrollBar()             // Returns { vertical: true/false, horizontal: true/false }
element.hasScrollBar().vertical    // Returns true/false
element.hasScrollBar().horizontal  // Returns true/false