javascript - JS - 如何为我的代码删除 setTimeOut

Question

我正在尝试使用垂直滚动来显示对象A。 这个想法是，如果我的滚动高度大于 scrollHeight (15)，那么在 1.2 秒 之后，< strong>A 将会出现。 然后当我滚动回到顶部时，A 将隐藏。

现在的问题是，如果我不使用 clearTimeout，setTimeout 将忽略条件:if ( scroll >= scrollHeight )

当我使用 clearTimeout 时，它似乎只在我快速滚动时才起作用，或者它根本不起作用。

这是我的代码。

var scrollHeight = 15;

$(window).scroll(function() {
    var scroll = getCurrentScroll();
    var delayThis;

    if ( scroll >= scrollHeight ) {
        delayThis = setTimeout(function(){

        //Display **A**... 

        }, 1200);

       }
       else{
        // Hide **A** ...
        clearTimeout(delayThis);
        }
  }

非常感谢您的帮助!!

Answer 1

如果消息已经显示，您必须告诉脚本，这样可以避免多次延迟。下面是我正在谈论的工作版本。希望对您有所帮助。

var scrollHeight = 15;
var message = $( ".message" ); 
var messagestatus = false;
var scrollposition;

$(window).scroll(function() { 
    scrollposition = $(document).scrollTop();
    
    if ( scrollposition >= scrollHeight ) {
        if ( messagestatus == false ) {
            setTimeout(function(){

                message.show();
                messagestatus = true;
                
            }, 1200);
        }

    } else{
        message.hide();
        messagestatus = false;
    } 
});

.message {
    display: none;
    position: fixed;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>top</p>
<div class="message">
    Show!
</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br />
<p>bottom</p>