在 jQuery 中使用 window.location.hash答案

【问题标题】：Using window.location.hash in jQuery在 jQuery 中使用 window.location.hash
【发布时间】：2011-12-14 09:43:40
【问题描述】：

我想使用jQuery制作一个褪色导航菜单，其中与当前页面对应的“按下”按钮与“未按下”按钮的行为不同（具体来说，它不会在悬停时褪色为不同的颜色）。如果我查看 www.guitaracademy.nl 上的示例，我发现他们使用带有 window.location.hash 属性的原生 javascript。

但是，我似乎无法将此哈希值导入 jQuery。这是一个示例脚本：

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    var p=window.location.hash;
    $("#clickme").click(function(){
        alert(p)
    });
});
</script>
</head>
<body>
<a href="#test">Click me first</a>
<div id="clickme">Then click me</div>
</body>
</html>

加载此页面后，我点击“先点击我”链接；然后在地址栏中我看到附加到原始 URL 的“#test”。但是，如果我然后单击“然后单击我”div，我会看到一个空警报。看起来哈希不是“更新”。

我将不胜感激任何帮助。

【问题讨论】：

标签： jquery hash window.location

【解决方案1】：

尝试将哈希调用移动到函数内部，以便在每次调用点击时调用它。按照您的方式，它仅在页面的初始加载时加载。

$(function(){
    $("#clickme").click(function(){
        var p=window.location.hash;
        alert(p)
    });
});

【讨论】：

嗨，是的，工作，谢谢大家的（收敛）回复！

【解决方案2】：

尝试将var p=window.location.hash; 放入您的点击监听器中：

<script type="text/javascript">
    $(function(){
        $("#clickme").click(function(){
            var p=window.location.hash;
            alert(p)
        });
    });
</script>

【讨论】：

【解决方案3】：

哈希正在更新，但在这种情况下，变量“p”没有更新。

这里是赋值语句

var p=window.location.hash;

仅在页面加载时执行一次。所以在加载的时候 P 的值是空的，并且永远是空的。

而不是

alert(p)

试试

alert(window.location.hash)

或在点击回调中移动分配。即刚刚高于警报声明

【讨论】：

【解决方案4】：

#clickme div 的函数从不尝试更新哈希值。如果您希望您的代码更新哈希，则必须像这样操作它：

$("#clickme").click(function(){
    window.location.hash='#secondclick';

    //Remaining Code
});

【讨论】：