快速簡便的jQuery滾動題

Question

我正在開發一個網站，當用戶到達頁面中的某些部分等時，將某些類添加到正文中。因此，我必須將 function 綁定到滾動事件。

像這樣緩存scrollTop()是否更好（簡短的例子，實際的 function 更長）：

scrollcheck: function() {

    var top = main.documentquery.scrollTop();

    if(top > 60) {stuff}
    if(top > 220) {more stuff}

還是只在所有情況下使用main.documentquery.scrollTop() ？

（ documentquery是$(document) ，我記得緩存很好，但我不確定scrollTop() ）

Answer 1

是的，最好緩存它，但最好限制對這個 function 的調用。 這可能會對性能產生更大的影響。 特別是，我會按照以下方式使用超時模式：

(function() {
    var _timeout = null;
    function onScrollHandler() {
        if (_timeout) {
            clearTimeout(_timeout);
        }
        _timeout = setTimeout(function() {
            _timeout = null;
            realScrollcheck();
        }, 500);
    }
    $(window).scroll(onScrollHandler);
 })();

在您的 function（此處稱為realScrollcheck ）運行的最后一次滾動之后會有半秒的延遲，但在 99% 的情況下這是可以接受的。 隨意調整超時。 :-)

Answer 2

是的。 最好存儲該值而不是每次都調用它。