javascript - 元素的滚动高度给出未定义的值

Question

在一个元素中，我给了 CSS overflow: scroll;。现在在 jQuery 中我想要它的原始高度(包含所有子元素的高度)。该元素下的子元素是动态变化的。我想在滚动事件上有高度。这是代码:

$("#container").scroll(function(e) {
    scrollAll();
});

function scrollAll(){
    var elemHeight = $("#container").scrollHeight;
    var scrollHeight = $("#scrollbars").scrollHeight;
    var ratio = elemHeight / scrollHeight;

    $("#outup").html( elemHeight +" and "+ scrollHeight +" ratio "+ ratio +" = "+ ($("#container").scrollTop()));
}

问题:它抛出 scrollHeight is undefined 错误。怎么了？

Answer 1

jQuery 中没有 scrollHeight - 它是 scrollTop():

var elemHeight = $("#container").scrollTop();
var scrollHeight = $("#scrollbars").scrollTop();

或者，如果您想使用原生的 scrollHeight 属性，您需要直接访问 jQuery 对象中的 DOM 元素，如下所示:

var elemHeight = $("#container")[0].scrollHeight;
var scrollHeight = $("#scrollbars")[0].scrollHeight;

或者像这样:

var elemHeight = $("#container").prop('scrollHeight');
var scrollHeight = $("#scrollbars").prop('scrollHeight');