让Ajax网页带有后退功能

原创 2006年06月16日 14:59:00

在AJAX做了一个项目后,测试人员告诉我,新闻列表翻了很多页后,当查看过一条新闻的详细信息返回目录的时候,不能返回到已经翻过的页码,而要从第一页重新翻,这样很郁闷。网上面找到一篇<开发保留标准浏览器功能的AJAX应用程序>的文章,按照里面的介绍,把响应的代码节选出来,保留在这里。

我实现原理是:每翻一次页,把当前的页码存入碎url的碎片标识中,待客户查看完详细信息后返回到目录,在目录的body的onload事件执行setOptionValue,将碎片的内容获取下来,再执行读取目录的函数;以达到保存翻页信息的功能。

//使用URI的碎片标识符部分,创建状态的历史记录;
function makeHistory(newHash)
{
  window.location.hash = newHash;
  expectedHash = window.location.hash;
  alert(expectedHash);
  return true;
}
//检查浏览器历史记录中的URI
function handleHistory()

  if ( window.location.hash != expectedHash )
  {
     alert(window.location.hash + "|" + expectedHash);
    expectedHash = window.location.hash;
    var newoption = expectedHash;
    setOptionValue( newoption );
  }
  return true;
}

function pollHash() {
  handleHistory();
  //window.setInterval("handleHistory()", 1000);
  return true;
}

//获取碎片中的内容,可进行任何操作
function setOptionValue(value)
{
//  var myForm = document.make_history;
//  var mySelect = myForm.change_year;
//  mySelect.options[value-1].selected = true;
    document.getElementById("testDiv").innerHTML = value.replace('#','');
    Test(value.replace('#',''));
    alert(value.replace('#',''));
  return true;
}

几种方法实现ajax请求内容时使用浏览器后退和前进功能

我们可以利用ajax进行无刷新改变文档内容,但是没办法去修改URL,即无法实现浏览器的前进与后退、书签的收藏功能。 利用location的hash部分和使用window.onhashchange来实现...
  • wkyseo
  • wkyseo
  • 2016年06月17日 14:35
  • 5105

让浏览器记住ajax请求并能前进和后退方法(一)

在我们浏览不同网页的时候,我们可以通过浏览器的前进、后退键来去到我们前后访问过的页面。这都有一个共同点,就是 浏览器地址栏的地址改变了。浏览器自身维护了一个记录用户访问页面历史的栈,栈中记录了用户访...

解决Ajax框架下页面回退刷新问题

存在问题 如果使用Firefox等浏览器访问RMS网站时,我们可能会发现页面之间的切换是通过AJAX异步请求实现的,同时页面的URL不会发生改变,虽然可以通过页面上的按钮通过AJAX异步请求实现回退...

ajax分页时,点击浏览器后退按钮返回到上一页

ajax翻页到第5页,然后点浏览器键后退键, 不会回到第4页 ?  ajax触发的时候, 浏览器上的url地址也需要跟着变啊, 后面跟#参数就可以了 HTML ...

AJAX的刷新和前进后退问题解决

使用AJAX开发分页功能的时候,用户跳转到第5页,但是刷新以后又显示第一页了,能不能刷新后还显示第5页?还有能不能用浏览器的前进后退按钮来浏览AJAX历次的变化。 因为Javascript对do...

ajax技术如何解决浏览器前进后退按键失效的问题

Q:ajax技术,很强大,但ajax应用中容易导致浏览器的前进后退按钮失效,不产生前进后退功能,这是个很头疼的问题,它严重的破坏了用户美好的体验,如何解决Ajax过程中导致的浏览器前进后退按键失效的问...
  • basycia
  • basycia
  • 2016年01月08日 15:48
  • 3956

AJAX 网页保留浏览器前进后退等功能

在一些AJAX被大量使用的页面,有时都不太敢刷新,因为刷新以后可能看到的是和原来有很大不同的页面。暂不讨论在某些页面内容大量更新的情况下是否该使用AJAX的问题,本文简单说一下保留浏览器前进、后退、刷...

一个简单的例子看明白如何利用window.location.hash实现ajax操作时浏览器的前进/后退功能

我们知道JavaScript中很早就提供了window.history对象,利用history对象的forward()、go()、back()方法能够方便实现不同页面之间的前进、后退等这种导航功能。但...

一个简单的例子看明白如何利用window.location.hash实现ajax操作时浏览器的前进/后退功能

我们知道JavaScript中很早就提供了window.history对象,利用history对象的forward()、Go()、back()方法能够方便实现不同页面之间的前进、后退等这种导航功能。但...
  • Truong
  • Truong
  • 2017年06月09日 16:58
  • 246

使用history.pushState()和popstate事件实现AJAX的前进、后退功能

上一篇文章中,我们使用location.hash来模拟ajax的前进后退功能。使用location.hash存在下面几个问题: 1.使用location.hash会导致地址栏的url发生变化,用户体验...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:让Ajax网页带有后退功能
举报原因:
原因补充:

(最多只允许输入30个字)