Jquery 检测滚动方向-第一次滚动更改方向时布尔变量错误

我想检测我是在向上滚动还是向下滚动。我还有一个全局变量，向下滚动时为

true

，向上滚动时为

false

问题是，如果我向下滚动一次，并继续向下滚动，控制台会记录

true

和

down

，但如果我只向上滚动一次，它会正确记录“up”，但也会记录

true

而不是

false

。当以另一种方式滚动时也是如此

所以在第一次滚动改变方向后，

down

变量基本上是错误的

<div id="id0" data-id="0" class="nbhd red scrolledto"></div>
<div id="id1" data-id="1" class="nbhd yellow"></div>
<div id="id2" data-id="2" class="nbhd green"></div>
<div id="id3" data-id="3" class="nbhd blue"></div>

var down = true;

    function setHeights() {
        $('.nbhd').css('height', window.innerHeight);
    }

    function scrollDirection() {
        var lastScrollTop = $(window).scrollTop();

        $(window).scroll(function(event) {

            var st = $(this).scrollTop();

            if (st > lastScrollTop){
                // down
                down = true;
                console.log('down');
            } else if (st < lastScrollTop) {
                // up
                down = false;
                console.log('up');
            }

            lastScrollTop = st;

        });

        console.log(down);
    }

    setHeights();

    $( window ).on( "scroll", function() {
        scrollDirection();
    });

var-down=true；
函数setHeights（）{
$（'.nbhd'）.css（'height'，window.innerHeight）；
}
函数scrollDirection（）{
var lastScrollTop=$（窗口）.scrollTop（）；
$（窗口）。滚动（功能（事件）{
var st=$（this.scrollTop（）；
如果（st>lastScrollTop）{
//向下
向下=真；
console.log（'down'）；
}否则如果（st

---

fiddle:

问题的一部分是，每当任何东西滚动时，您都会挂起滚动事件，因为您有：

$( window ).on( "scroll", function() {
    scrollDirection();
});

$(window).scroll(function(event) {
    // ...
});

…每次有滚动时调用

scrollDirection

，在

scrollDirection

中有以下内容：

$( window ).on( "scroll", function() {
    scrollDirection();
});

$(window).scroll(function(event) {
    // ...
});

…这将添加另一个处理程序。每一次。在相对少量的滚动之后，页面将变得迟钝，并且随着所有事件的累积，最终没有响应

另外，由于反复调用

scrollDirection

，因此在内部处理程序有机会使用它之前，

lastScroll

会被更新

只需连接一个处理程序，并记住最后一个滚动位置：

var lastScroll = 0;
var down = false;
$(window).on("scroll", function() {
    var scroll = $(this).scrollTop();
    down = scroll > lastScroll;
    lastScroll = scroll;
});

实例：

（函数（）{
var lastScroll=0；
var-down=false；
$（窗口）.on（“滚动”，函数（）{
var scroll=$（this.scrollTop（）；
向下=滚动>最后滚动；
lastScroll=滚动；
$（“#指示器”）.text（向下？“向下”：“向上”）；
});
})();
（尚未滚动）
滚动这个

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。

。