JQuery Ajax在url中添加哈希答案

【问题标题】：JQuery Ajax adding hash in the urlJQuery Ajax在url中添加哈希
【发布时间】：2012-12-08 19:16:26
【问题描述】：

我这里有这个使用 struts2-jquery 插件的代码

<h4>Choose A task</h4>
    <ul>
        <s:url value="views/ajaxvalidation.jsp" var="ajaxvalidation" >
            <s:param name="menuId" value="1"/>
        </s:url>
        <li><sj:a targets="resultContent" href="%{ajaxvalidation}">Ajax Validation</sj:a></li>
    </ul>

当我点击它的内容时，url 变成了这样的东西，url 没有任何变化。它仍然保持不变，我想要的是当我单击链接时会发生这样的事情 www.myapp.com/#ajaxvalidation 。当我运行代码锚标记被翻译成这样的东西

<a id="anchor_1365013162" href="javascript:void(0)">Ajax Validation</a>

有了这个，我将如何在 url 中添加一个哈希？

【问题讨论】：

当您使用 AJAX 时，不应更改 URL，因为您没有加载新文档。 AJAX 是一种透明的幕后通信。
@Barmar 然后我如何将哈希添加到 url？我需要重写 url（或向其添加哈希）但使用 ajax 加载选定的内容，因为我有一个正在加载的音乐播放器
document.location.hash = 'ajaxvalidation' 是您要找的吗？
我将如何使用 document.location.hash ？请举个例子
@KyelJmD - Barmar 上面的评论有一个完整的示例，该行会在 url 中添加一个哈希值，您所要做的就是付出一些努力并尝试一下，您就会明白这一点出来，因为它真的很简单。

标签： javascript jquery ajax url struts2

【解决方案1】：

这是一个工作示例（不考虑 Struts2）：

<html>
<body>
<a id="123" href="">Add Hash</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $("a").click(function(e) {
        window.location.hash = $(this).attr("id");
        e.preventDefault();
    });
});
</script>
</body>
</html>

【讨论】：

无论如何我可以通过编程方式添加#id/somename/ 吗？但这有效
window.location.hash = 'id/somename/'

【解决方案2】：

如果您不想跳转页面，则可以通过在现代浏览器上使用历史 API 并回退到旧浏览器来解决此问题：

if(history.pushState) {
    history.pushState(null, null, '#myhash');
} else {
    location.hash = '#myhash';
}

归功于Lea Verou

【讨论】：