在用ajax获取数据,不刷新页面情况下,保持前进后退按钮功能,网页端兼容性最好的方式如下:

首先url后面参数用#  如http://www.xxx.com/#txf; 使用改变location.hash来改变#后面参数时,页面不会跳转,但会产生记录。这样就能做监控了:

var oldURL,newURL;

//检查浏览器url 前进和后退键
if( ("onhashchange" in window) && ((typeof document.documentMode==="undefined") || document.documentMode==8)) {
    // 浏览器支持onhashchange事件
    window.onhashchange = changeUrl; // TODO,对应新的hash执行的操作函数
} else {
    // 不支持则用定时器检测的办法
    setInterval(function() {
        var ischanged = isHashChanged(); // TODO,检测hash值或其中某一段是否更改的函数
        if(ischanged) {
            changeUrl(); // TODO,对应新的hash执行的操作函数
        }
    },200);
};
function isHashChanged(){
    newURL=location.hash;
    if(oldURL==newURL){
        return false;
    }else{
        oldURL=newURL
        return true;
    };
};

function changeUrl(){//url改变时候执行的事件方法

};

检查浏览器url改变,处理ajax前进和后退键的更多相关文章

  1. js 浏览器窗口大小改变 高度 宽度获取 window/document.height()区别

    <script> //当浏览器的窗口大小被改变时触发的事件window.onresize window.onresize = function(){ console.log($(windo ...

  2. 使用 JavaScript 修改浏览器 URL 地址栏

    现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不 ...

  3. HTML5 修改浏览器url而不刷新页面

    嘛,起因是黑子大叔在微博上的一条@信息,找起了这个的实现,看了一圈google的中文信息内似乎还没有怎么提到这个的内容,就发表上来. 详细效果就是类似于用Firefox4+/Chrome 5+/Saf ...

  4. 如何获取浏览器URL中查询字符串的参数

    首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...

  5. 如何检测浏览器url变化

    用户通过“点击触发”,“操作历史”,“直接访问URL”的方式修改当前URL.这三种触发方式会使浏览器做出不同的行为 html5提供了两种方式在页面中操作历史 history.pushState(sta ...

  6. 使用JavaScript修改浏览器URL地址栏的实现代码【转】

    引用自http://www.jb51.net/article/42240.htm 现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起 ...

  7. JS获取浏览器URL中查询字符串的参数

    首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...

  8. 使用JavaScript 修改浏览器 URL 地址栏

    现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不 ...

  9. 使用JavaScript修改浏览器URL地址栏的实现代码

    现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不 ...

随机推荐

  1. 【转】Linux强大命令 Awk 20分钟入门介绍

    什么是Awk Awk是一种小巧的编程语言及命令行工具.(其名称得自于它的创始人Alfred Aho.Peter Weinberger 和 Brian Kernighan姓氏的首个字母).它非常适合服务 ...

  2. C语言-表达式

    表达式是使用运算符连接起来的式子,C语言中的表达式有以下几种: 1.算数运算符 + - * / % 2.赋值运算符 +=  -=  *=  /=  %= 3.自增.自减 ++   --   a++为先 ...

  3. xlrd(开excel表格)

    打来表格 wb = xlrd.open_workbook('example.xlsx') 选择sheet sh=wb.sheet_by_index(序号) 表格的行数 sh.nrows 选取第m行第n ...

  4. Bzoj3756

    传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=3756 题解:乱搞 代码: #include<iostream> #include ...

  5. 14.TCP的坚持定时器和保活定时器

    一.坚持定时器   1.坚持定时器的由来         TCP通过让接收方指明希望从发送方接受的窗口大小来进行流量控制.设置窗口大小为0可以组织发送方传送数据,直至窗口变为非0为止.         ...

  6. orientationchange

    <!DOCTYPE html> <html> <head> <title>OrientationChange Event Example</tit ...

  7. OD提示 "为了执行系统不支持的动作, OllyICE 在这个被调试的程序中注入了一点代码, 但是经过5秒仍未收到响应..." 解决办法

    别的OD就可以,我自己整合过的一个很顺手的OD就是不行,最后找到了解决办法: 转自:http://bbs.pediy.com/showthread.PHP?t=97629 -------------- ...

  8. eclipse 工具栏修改

    本来和同学约好一起去吃饭的,刚电话说有亲戚过来了,叫我一起去吃 哪有那个闲心,去陪他们吃饭 刚好,把这个一起写了 相信很多人会很烦,eclipse的工具栏太多了,折了一行下来,看着不好看,还烦(本人觉 ...

  9. inheritprototype原型继承封装及综合继承最简实例

    1.inheritprototype.js ;(function(){    var s = {        inheritObject:function(o){//对象继承封装           ...

  10. js原生设计模式——2面向对象编程之继承—call(this)构造函数式继承

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...