在jQuery中刷新页面时如何留在选项卡上？答案

【问题标题】：How to stay on tab when refresh page in jQuery?在jQuery中刷新页面时如何留在选项卡上？
【发布时间】：2014-01-25 09:24:30
【问题描述】：

页面在不加载的情况下发生变化（感谢 jQuery），但在重新加载页面后，它们总是回到主页（main.jsp）。刷新后是否可以停留在我选择的页面上？

JSP 文件（main.jsp）：

<ul>
    if ((loginBean.getStatus() != "") && (loginBean.getStatus() != null)) {
%>
<li><a href=main.jsp><h:outputText value="#{kom.glowna}"/></a></li>
<li><a id="about_us" href="#about">O nas</a></li>
    <%
        if (loginBean.getStatus().equals("admin")) {
    %>
<li><a id="show_accounts" href="#accounts"><h:outputText value="#{kom.konta}"/></a></li>
<li><a id="register_all" href="#register"><h:outputText value="#{kom.zarejestruj}"/></a></li>
<li><a id="delete_account" href="#delete"><h:outputText value="#{kom.usun}"/></a></li>
    <%
    } else if (loginBean.getStatus().equals("klient")) {
    %>
<li><a id="zapis_na_wizyte" href="#visit"><h:outputText value="#{kom.wizyta}"/></a></li>
<li><a id="add_animal" href="#animal"><h:outputText value="#{kom.zwierze}"/></a></li>
<%
} else if (loginBean.getStatus().equals("lekarz")) {
%>
<li><a id="patients" href="#patients"><h:outputText value="#{kom.pacjenci}"/></a></li>
    <%
        }
    %>
<li><a id="my_account" href="#account"><h:outputText value="#{kom.konto}"/></a></li>
<li>
    <h:form>
        <h:commandLink action="#{loginBean.logout}" ><h:outputText value="#{kom.wyloguj}"/></h:commandLink>
    </h:form>
</li>
<%
} else {
%>    
<li>
    <h:form>
        <h:commandLink value="Wróć do strony głównej." action="#{loginBean.logout}"><h:outputText value="#{kom.wroc}"/></h:commandLink>
    </h:form>
</li>
<%
    }
%>
</ul>

JavaScript：

$().ready(function()
{
    $("#about_us").click(function()
    {
        $("article").load("about.jsp");
    });
    $("#show_accounts").click(function()
    {
        $("article").load("showAccounts.jsp");
    });
    $("#register_all").click(function()
    {
        $("article").load("registerAll.jsp");
    });
    $("#delete_account").click(function()
    {
        $("article").load("deleteAccount.jsp");
    });
    $("#zapis_na_wizyte").click(function()
    {
        $("article").load("showAnimal.jsp");
    });
    $("#add_animal").click(function()
    {
        $("article").load("addAnimal.jsp");
    });
    $("#patients").click(function()
    {
        $("article").load("pacjenci.jsp");
    });
    $("#my_account").click(function()
    {
        $("article").load("account.jsp");
    });
});

如有任何帮助，我将不胜感激。

【问题讨论】：

旁注，建议不要使用$().ready(function，而应使用$(document).ready(function 或$(function

标签： javascript jquery jsp jsf

【解决方案1】：

一种方法是使用hash。

我们的想法是使用此事件来处理哈希更改时的情况。当您加载包含哈希的页面时也会发送此事件（例如 yoursite.com/main.jsp#my_account）。

要检索当前哈希，请使用window.location.hash。

另一种方法是使用History.js。

见https://github.com/browserstate/history.js/

【讨论】：

【解决方案2】：

您可以使用 cookie（或会话）来保存页面。这里有一个jquery插件来管理cookies：http://plugins.jquery.com/cookie/

【讨论】：