javascript - 页面刷新更新功能

标签 javascript jquery

我有一个简单的 JavaScript 函数来检测页面滚动。

一切正常。

唯一的遗漏是,当刷新页面时,滚动不会保留,因此需要恢复。

我认为这可能很简单,只需将 pub.init 中对 docScroll() 的直接调用替换为 $(window).on("load", docScroll( ));在 setBindings 中,但不幸的是这不起作用。

有人提供建议吗?

var scroll = function () {
    var pub = {}, timeout = null;

    function reset() {
        if (typeof (timeout))
            clearTimeout(timeout);

        timeout = setTimeout(function () {
            docScoll();
        }, 200);
    }

    function docScroll() {
        $body = $("body");
        var headerHeight = $("#header").height();

        $(document).scroll(function () {
            if ($(window).scrollTop() > headerHeight) {
                $body.addClass("scrolling");
            }
            else {
                $body.removeClass("scrolling");
            }
        });
    }

    function setBindings() {
        $(window).on("resize", reset);
    }

    pub.init = function () {
        setBindings();
        docScroll();
    }

    return pub;
} ();

最佳答案

滚动事件处理程序应该设置一次。所以我会做这样的事情:

var scroll = function () {
    var pub = {};

    function docScroll() {
        var $body = $("body");
        var headerHeight = $("#header").height();

        if ($(window).scrollTop() > headerHeight) {
            $body.addClass("scrolling");
        }
        else {
            $body.removeClass("scrolling");
        }
    }

    function setBindings() {
        $(document).scroll(docScroll);
    }

    pub.init = function () {
        setBindings();
        docScroll();
    }

    return pub;
} ();

关于javascript - 页面刷新更新功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44196704/

相关文章:

javascript - 使用大量术语,搜索页面文本并用链接替换单词

JavaScript 相当于 Ruby 的 .each

jquery 设置文本

jquery - 点击添加类(class)?

javascript - 计算 JSON 中具有某些属性的元素的数量

php - 使用 PHP 创建 PHP 文件

javascript - 合并 OnMouseUp/Down 功能?

javascript - 如何在选项卡标题部分创建带有图像的可切换选项卡?

javascript - 只允许在我的网站中垂直滚动到一个固定的限制

javascript - 每次调用都会重新创建嵌套函数吗?