1

我是一个初学者并且已经彻底搜索过,没有找到解决这个问题的方法。

我编写了一个代码,当您单击链接时,css 样式会发生变化,如下所示:

function spHome(){
    document.getElementById("btnHome2").style.background = "url(../images/btn_navHoverArrow.png) no-repeat center bottom";
    document.getElementById("btnAccount").style.background = "0";
}

function spAccount(){
    document.getElementById("btnHome2").style.background = "0";
    document.getElementById("btnAccount").style.background = "url(../images/btn_navHoverArrow.png) no-repeat center bottom";
}

这段代码工作得很好。对我来说,问题是当我刷新页面时,点击状态不再活跃。是否有代码可以仅在用户位于页面的某个锚点时才允许该功能保持活动状态。例如,如果我们有一个名为index.html#home的锚点位置,则主页按钮将处于活动状态,当单击index.html#account时,即使在页面刷新后,帐户按钮也会保持单击状态。

下面的示例似乎不适用于 jsfiddle,但适用于所有浏览器:http: //jsfiddle.net/JoshuaWaheed/HZLVt/3/

有没有办法做到这一点?

4

1 回答 1

2

添加 href 哈希并返回 false onclick 以避免页面重新加载

<a href="#home" onclick="spHome();return false" id="btnHome2" title="Home"></a>

您需要在页面加载时执行 js,检查 url 的哈希值,并将按钮的状态对应于哈希值。

使用 jQuery,它将类似于(未测试):

$(function() {

    if (document.location.hash == "#home")
        spHome()
    else
        if (document.location.hash == "#account")
            spAccount()
})

如果您不想使用 jQuery,可以将该代码放在文档事件“load”上

于 2013-07-09T15:29:18.780 回答