让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
  • 5563

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

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

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

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

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

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

Ajax请求返回一个页面,实现页面局部刷新

本文实现Ajax的局部刷新。思路如下: 首先,从JSP页面A.jsp向服务端发起一个Ajax请求,由Action中方法MethodA处理,该MethodA方法进行数据组装后,返回一个jsp页面Res...
  • liu765023051
  • liu765023051
  • 2015年04月27日 12:59
  • 17332

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

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

让Ajax网页带有后退功能

在AJAX做了一个项目后,测试人员告诉我,新闻列表翻了很多页后,当查看过一条新闻的详细信息返回目录的时候,不能返回到已经翻过的页码,而要从第一页重新翻,这样很郁闷。网上面找到一篇的文章,按照里面的介绍...
  • leisky
  • leisky
  • 2006年06月16日 14:59
  • 2631

对ajax前进后退的处理

  • 2014年08月07日 18:10
  • 27KB
  • 下载

javascript 网页禁止按键后退功能

//退格键禁止后退 $(document).keydown(function(e) { //绑定键盘按下事件 var doPrevent; // for IE && Firefox ...
  • luolei3344
  • luolei3344
  • 2017年03月30日 17:23
  • 347

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

存在问题 如果使用Firefox等浏览器访问RMS网站时,我们可能会发现页面之间的切换是通过AJAX异步请求实现的,同时页面的URL不会发生改变,虽然可以通过页面上的按钮通过AJAX异步请求实现回退...
  • u010403387
  • u010403387
  • 2015年05月08日 10:06
  • 4884
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:让Ajax网页带有后退功能
举报原因:
原因补充:

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