Question

好吧，这就是我要做的事情（我认为Google也是这样做的）：

情景A：

在页面/Main_Page中，假设有3个部分。当用户点击A部分“链接”时，section A的内容将通过AJAX加载并嵌入到页面中。

情景B：

加载/Main_Page/Section_A时，我们实际上会转到同一页面（如方案A） - /Main_Page并通过AJAX加载Section A - 与以前一样。

问题：

我们有2个相同的结果页面，但网址不同（在第一种情况下它只是/Main_Page，而在第二种情况下它将是/Main_Page/Section_A）。

我想做什么：

在场景A中，在通过AJAX加载Section A之后，我该怎么做才能使出现的URL（在浏览器地址栏中）为/Main_Page/Section_A（或其他任何事情），任何类型的重定向，页面重新加载等？

Answer 1

您的问题可以通过实施History API来解决，尤其是使用pushState()方法。我推荐reading about it in MDN。还有一个名为History.js的一体化解决方案，它可以帮助您轻松实现x-browser（如果浏览器不支持，它将回退到URL哈希#。） p>

以下是一个例子：

history.pushState('', 'New Page Title', newHREF);

不够兴奋？这是一个demo，鼓励您实施它。

Answer 2

我刚刚找到了一个教程，它对我有用，

$('a').click(function(){
var value = $(this).attr('id');
window.location.hash = value; // it appends id to url without refresh
});


$(window).bind('hashchange' function() {
    var newhash = window.location.hash.substring(1) // it gets id of clicked element
    // use load function of jquery to do the necessary...
});

我从上面获得了上述代码 http://css-tricks.com/video-screencasts/85-best-practices-dynamic-content/

如何在不重新加载的情况下动态更改URL？

2 个答案: