如何在ajax请求后更改URL？

Question

我有一个菜单,其中包含一些更新div content并onSuccess在加载后执行该功能的链接.

<li>@Ajax.ActionLink("Home", "Index", "home")</li>
<li>@Ajax.ActionLink("Download", "Index", "download")</li>

如果我在网址上/home并单击下载链接,则div会成功更改.问题是URL没有改变.

如何检索请求的URL以便我可以调用history.pushState成功的请求？

Answer 1

从这个问题(如何在jQuery $ .get/ajax请求中获取请求URL)我发现我可以使用它来检索它this.url.

从MDC window.history我找到了语法并从MDC操作浏览器历史记录我发现我可以获得当前状态history.state(虽然似乎不适用于Chrome)并且发现在调用时pushState我只能发送640k字符stateObject否则它会引发异常.

我目前成功的ajax请求的方法是:

OnSuccess: function(html, status, xhr){
    var requestedUrl = this.url.replace(/[&?]X-Requested-With=XMLHttpRequest/i, "");

    // if the url is the same, replace the state
    if (window.location.href == requestedUrl)
    {
        history.replaceState({html:html}, document.title, requestedUrl);
    }
    else
    {
        history.pushState({html:html}, document.title, requestedUrl);
    }
},

对于基本测试,我将整个结果存储在stateObject,如果它抛出异常,我将设置URL而不是能够发出新请求.

我的popstate活动是

$(window).bind("popstate", function (e) {
    var state = e.originalEvent.state;
    $("#body").html(state.html);
});

它恢复以前的页面,我不需要提出新的请求.