有没有一种方法可以在不重新加载页面的情况下修改当前页面的URL?

如果可能,我想访问#哈希之前的部分。

我只需要更改域之后的部分,所以我不会违反跨域策略。

 window.location.href = "www.mysite.com/page2.php";  // this reloads

当前回答

这段代码对我很有用。我在ajax应用程序中使用了它。

history.pushState({ foo: 'bar' }, '', '/bank');

一旦使用ajax将页面加载到ID中,它会自动更改浏览器url,而无需重新加载页面。

这是下面的ajax函数。

function showData(){
    $.ajax({
      type: "POST",
      url: "Bank.php", 
      data: {}, 
      success: function(html){          
        $("#viewpage").html(html).show();
        $("#viewpage").css("margin-left","0px");
      }
    });
  }

示例:从任何页面或控制器(如“Dashboard”),当我单击银行时,它会使用ajax代码加载银行列表,而无需重新加载页面。此时,浏览器URL将不会更改。

history.pushState({ foo: 'bar' }, '', '/bank');

但是当我在ajax中使用这段代码时,它会在不重新加载页面的情况下更改浏览器url。下面是完整的ajax代码。

function showData(){
        $.ajax({
          type: "POST",
          url: "Bank.php", 
          data: {}, 
          success: function(html){          
            $("#viewpage").html(html).show();
            $("#viewpage").css("margin-left","0px");
            history.pushState({ foo: 'bar' }, '', '/bank');
          }
        });
      }

其他回答

您可以在应用程序的任何位置使用这个美丽而简单的功能。

function changeurl(url, title) {
    var new_url = '/' + url;
    window.history.pushState('data', title, new_url);
    
}

您不仅可以编辑URL,还可以同时更新标题。

注意:如果你使用的是HTML5浏览器,那么你应该忽略这个答案。从其他答案中可以看出,这现在是可能的。

在不重新加载页面的情况下,无法在浏览器中修改URL。URL表示最后加载的页面。如果您更改它(document.location),它将重新加载页面。

一个明显的原因是,你在www.mysite.com上写了一个看起来像银行登录页面的网站。然后你将浏览器的URL栏更改为www.mybank.com。用户将完全不知道他们真的在看www.mysite.com。

使用HTML5历史API中的history.pushState()。

有关详细信息,请参阅HTML5历史API。

下面是在不重新加载页面的情况下更改URL的功能。它仅支持HTML5。

  function ChangeUrl(page, url) {
        if (typeof (history.pushState) != "undefined") {
            var obj = {Page: page, Url: url};
            history.pushState(obj, obj.Page, obj.Url);
        } else {
            window.location.href = "homePage";
            // alert("Browser does not support HTML5.");
        }
    }

  ChangeUrl('Page1', 'homePage');

您的新url。

let newUrlIS =  window.location.origin + '/user/profile/management';

在某种意义上,调用pushState()类似于设置window.location=“#foo”,因为两者都会创建并激活与当前文档相关的另一个历史条目。但是pushState()有一些优点:

history.pushState({}, null, newUrlIS);

您可以签出根目录:https://developer.mozilla.org/en-US/docs/Web/API/History_API