Question

这是我的代码：

$("a").on("click", function(event) {

    var refrence = $(this).attr("href");
    window.history.pushState( {}, "", refrence );
    event.preventDefault();

});

现在，如果我第一次点击一个锚点，我们说它的href是：http://example.com/pages/about，

网址更改正确;但是，如果我下次点击此锚点：http://example.com/pages/contact，

浏览器上的网址将变为：http://example.com/pages/pages/contact，

您看到 / pages 目录未首次从网址中清除。我该如何解决这个问题？

编辑：

<a href="pages/about.html" class="ajax">About</a>
<a href="pages/contact.html" class="ajax">Contact</a>

这是我正在处理的HTML。

//  ajax
var $main = $("main");

$(".ajax").on("click", function(event) {

    var refrence = $(this).prop("href");
    var myAjax = function() {
        $main.load(refrence);
    };
    window.history.pushState(myAjax(), "", refrence);

    event.preventDefault();

});

这是我正在使用的JS全功能。

我也在localhost上工作。

Answer 1

使用/pages/about.html（带前导斜杠）等绝对网址，而不是pages/about.html等相对网址，或提供<base href="/">等base元素。

否则，一旦导航（通过静态链接或在JS中使用history.pushState()），将根据更新的当前目录（/pages/ + pages/about.html = {解析相对链接{1}}等。）。

pushState - 从href删除父目录？

1 个答案: