Jquery偏移量返回错误的值

Question

我有一个折叠的侧边栏(使用引导程序),我正在尝试确保折叠的元素在可见时滚动到.

为了做到这一点,我使用jQuery的offset(),第一次点击返回0并在第二次点击时返回正确的偏移量.

这是我的代码:

    $.each($('[data-toggle="collapse"]'), function() {
        $(this).on("click", function() { 
            if ($(this).is('A')) { 
                event.preventDefault(); $(this).toggleClass("active");
                var x = $(this).attr("href");
                console.log($(x).offset().top)

            }
        })
    })

Answer 1

设置的项目display: none在页面流之外,这意味着它们在页面中不占用任何空间.这意味着当它们被设置为时display: none,它们没有偏移值.

在第一次单击时,浏览器尝试查找偏移量,该值为0,然后显示该元素.一旦显示元素,就会给出偏移左/上值.

示例小提琴