如何加载页面而不重新加载?

可能重复:
修改网址而不重新加载页面

我知道这个话题有点奇怪。

当我访问http://www.heroku.com/how/relax并点击其他菜单(Deploy,Connect等...)时,我发现浏览器改变了它的url,但感觉就像Ajax。

这种技术叫做什么?


这种技术被称为使用javascript和DOM来改变fadeIn()和[fadeOut()] [2]动画(用于jQuery)页面的内容。

对于页面位置更改:

您必须使用HTML5的pushState()方法来更改浏览器历史记录。

window.history.pushState(data, "Title", "/new-url");

Doc说:

pushState()有三个参数:一个状态对象,一个标题(目前被忽略)和(可选)一个URL。

最后一个参数是新的URL。 出于安全原因,您只能更改URL的路径,而不是域本身。 第二个参数是对新状态的描述。 第一个参数是您可能想要与状态一起存储的一些数据。


很可能使用pushState() API将浏览器URL更改为“假”导航。 新内容可以通过AJAX预加载或获取。


有问题的代码:

historyAPISupported : function(){
  return (typeof window.history.pushState !== 'undefined')
},

clickTab : function(tab){
  var humanTab = tab.replace('js-', '')
  var newUrl = document.location.pathname.replace(//(how.*)/, '/how/' + humanTab)
  this.activateTab(tab)
  if (this.historyAPISupported()){
    window.history.pushState({ path: newUrl }, null, newUrl)
  }else{
    if (document.location.pathname != newUrl){
      document.location.href = document.location.href.replace(//(how.*)/, '/how/' + humanTab)
    }
  }
},

最好我可以告诉它仍然使用锚点,但利用浏览器历史进行更改(您可以快速看到您的“进度”栏显示位置的哈希值,但浏览器URL更改)。

除此之外,内容从一开始就被加载,内容只是淡入和淡出。

关于实际问题,我不认为它有一个具体的名称。 AJAX在幕后加载内容,转换使视觉效果,以及一些狡猾的JS使链接看起来改变。

链接地址: http://www.djcxy.com/p/70295.html

上一篇: How to load a page without reloading it?

下一篇: Change URL in address bar without having to reload