ajax后退解决方案（三）

技术专家

于 2011-09-30 10:08:59 发布

阅读量1k

点赞数

分类专栏： Ajax/jquery ajax 文章标签： ajax html iframe function button border

本文链接：https://blog.csdn.net/SmartTony/article/details/6836338

版权

Ajax/jquery ajax 专栏收录该内容

31 篇文章 0 订阅

订阅专栏

三、使用iframe，通过修改iframe.src产生历史，回调写在iframe对应的html页面中

 
     01<!DOCTYPE html> 
 
     02<html> 
 
     03<head> 
 
     04    <meta charset="utf-8" /> 
 
     05    <title>0</title> 
 
     06</head> 
 
     07<body> 
 
     08    <input type="button" value="加1" onclick="add()" /> 
 
     09    <div id="info" style="border:red 1px solid;width:200px;padding:10px;">0</div> 
 
     10</body> 
 
     11</html> 
 
     12<script src="history-0.3.js"></script> 
 
     13<script> 
 
     14    var info = document.getElementById('info'); 
 
     15    var i = 1; 
 
     16    function add() { 
 
     17        var data = { 
 
     18            param : i, 
 
     19            func : func 
 
     20        }; 
 
     21        History.push(data); 
 
     22        i++; 
 
     23    } 
 
     24      
 
     25    History.push({param:0, func: func}); 
 
     26      
 
     27    function func(i) { 
 
     28        info.innerHTML = i; 
 
     29        document.title = i; 
 
     30    } 
 
     31</script>

与方案2相同也是使用iframe.src来产生历史，也需要一个单独的html页面（iframe）。不同的是回调逻辑不是写在iframe.onload中，而直接写在html页面中（上一篇则是空的html架子）。blank.html如下

 
     01<!DOCTYPE HTML> 
 
     02<html> 
 
     03<head> 
 
     04<title>blank.html</title> 
 
     05</head> 
 
     06<body> 
 
     07    <script> 
 
     08        var url= location.href; 
 
     09        if(url.indexOf('?')>-1) { 
 
     10            var idx = url.substr(url.indexOf('?')+1); 
 
     11            parent.History.get(idx); 
 
     12        } 
 
     13    </script> 
 
     14</body> 
 
     15</html>