jquery - 如果#hash 在 url 中，则将类添加到正文

Question

我有以下代码，如果网址中存在#hash，它会向正文添加一个类 - 但只有在重新加载浏览器时它才有效。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

<script>
    $(document).ready(function() {

        if (window.location.href.indexOf('#login') != -1) {
            $(document.body).addClass('modalOpen');
        }

    });
</script>

不确定我做错了什么？我希望它在有人到达 homepage.com#login

时添加类(class)

提前致谢!安迪

Answer 1

问题是您的代码在加载文档时运行，如果用户到达#login，则不会再次加载文档。解决方案是单独定义您的函数

function hashChange() {
    if (window.location.href.indexOf('#login') != -1) {
        $(document.body).addClass('modalOpen');
    }
}

并在 onhashchange 事件中调用它:

window.onhashchange = function() {
    hashChange();
};

您也可以在页面加载时调用它。