ajax后退解决方案（五）

最新推荐文章于 2021-08-05 12:38:02 发布

转载最新推荐文章于 2021-08-05 12:38:02 发布 · 143 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/springMVC/archive/2011/09/30/2204308.html

文章标签：

#javascript #ViewUI

本文详细介绍了HTML5中的history.pushState和popstate API如何用于创建网页历史记录，包括如何通过JavaScript操作这些API来实现前进、后退和重定向功能。文章还讨论了这些API在不同浏览器上的兼容性，并提供了实际应用案例。

五、使用history.pushState产生历史，popstate事件处理后退

      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.5.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        info.innerHTML = i; 

      22        document.title = i; 

      23        History.push(data); 

      24        i++; 

      25    } 

      26      

      27    function func(i) { 

      28        info.innerHTML = i; 

      29        document.title = i; 

      30    } 

      31</script>