如何更改网址，然后刷新页面(Safari / Firefox)

Question

我有一个简单的ajax调用，用jQuery编写。它将字符串传递给服务器，服务器返回一些 json 数据。

$.ajax({
        url: ...,
        dataType: 'json',
        success: function(data) {
            for (var d in data) {
                var title = $('<a onClick="location.reload()" href="/player#v='+ data[d].content.id+'" "><p>'+ name +'</p></a>');
            }
        }
    });

我想发生的是当用户单击该链接（"标题"）时，页面将在该新URL上重新加载。请记住，当前页面是它想要重定向到的页面，但在 URL 中使用新的哈希值（本质上是用新内容重新加载页面上的所有内容）。这在Chrome中完美运行。在 Safari 和 Firefox 中，无论您单击列中的哪个链接（有多个具有不同 URI 的链接），它都会重新加载当前页面。如果我取出 onClick 事件，URL 会发生变化，但页面不会重新加载。

我尝试使用 window.location.replace（'new url here'）将 onClick 事件更改为自定义函数，但它什么也没做。任何帮助，不胜感激。

Answer 1

我可以做两件事：

不要使用相对网址。 /player#v='+ data[d].content.id+'" " .

试试这个代码：

$.ajax({
  url: ...,
  dataType: 'json',
  success: function(data) {
    for (var d in data) {
      var title = $('<a onClick="javascript: location.href=this.src ;" href="/player#v='+ data[d].content.id+'" "><p>'+ name +'</p></a>');
    }
  }
});

我建议反对该解决方案，而是将点击与 jquery 绑定在外侧，而不是这个 onClick 有一个执行函数 - 点击处理程序

Answer 2

在尝试了许多解决方案之后，无论是在onClick事件的上下文中还是直接在ajax调用的HTML中更改，我发现了一个更简单的jQuery原生解决方案。

在 ajax 调用之外，我使用了 jQuery 的内置"onhashchange"事件：

$(window).on('hashchange', function() {
        location.reload();
});

然后 ajax 调用中的 html 如下所示：

var title = $('<a href="/player#v='+data[d].content.id+'"><p>'+ name +'</p>   </a>');

以前，在

问题的代码中，在 Chrome 中，页面会在单击项目后重新加载，并使用新内容刷新页面。但是在 Safari 和 FireFox 中，页面重新加载是在触发新内容之前进行的，因此会重新加载具有相同内容的页面。

现在，新内容（URL 中的哈希）被强制识别，然后才重新加载页面。经过测试，可在Chrome，FireFox和Safari中工作。