Jquery 禁用浏览器的后退和前进按钮

使用js,Jquery 禁用浏览器的back 和 next 按钮：

有时为了防治用户乱了访问顺序，不得不禁掉浏览器的前进后退按钮。

jQuery(document).ready(function () {
if (window.history && window.history.pushState) {
$(window).on('popstate', function () {
/// 当点击浏览器的 后退和前进按钮 时才会被触发，
window.history.pushState('forward', null, '');
window.history.forward(1);
});
}
//
window.history.pushState('forward', null, ''); //在IE中必须得有这两行
window.history.forward(1);
});

这段代码主要使用js的window.history  对象；介绍一下history的几个比较重要的方法：

1、window.history.forward();   //加载下一个页面（浏览过的） ，和浏览器上的 前进按钮 效果相同

2、window.history.back();    //回到上一个页面 ， 和浏览器上的 后退按钮效果相同

ps： 如果浏览的网页有缓存， 当点击浏览器上的 前进和后退 按钮时， 是优先加载浏览器的缓存数据,(重要一点是：不走服务器端代码，如果在服务器端代码加断点，是不过断点的， 这也是缓存的一个弊端，有时候容易导致表单中的数据错乱掉，不能及时更新，)

3、history.go(0);    //刷新当前页面 和浏览器上的 刷新 按钮效果相同

history.go(-1): 效果和history.back() 效果相同

history.go(1) : 效果和history.forward() 效果相同

PS:  js history对象示例代码

4、window.history.pushState(状态码, 标题 ， url)   /// 添加并激活一个历史记录条目， 向history 添加当前页面的历史记录，并修改当前页面的url。

举个例子：

假如当前页面的url是：http://localhost:8080/index.html

执行：window.history.pushState('forward', null, 'badu.html');

结果： 在浏览器历史记录中添加一条记录http://localhost:8080/index.html。当前页面的url变成http://localhost:8080/badu.html ，但是不会刷新页面，也不会检查url是否正确。  这时如果点击 浏览器的back按钮会回退到http://localhost:8080/index.html页面， 还是当前页面。 所以这就是上面禁用back按钮 的原理。

5、History.replaceStatet();   参数和pushState()函数一样， 作用替换当前的url。

6、每当激活的历史记录发生变化时，都会触发popstate事件 ， 点击浏览器的back 和 next 按钮会触发popstate事件 ， 点击刷新按钮不会。

所以可以使用 popstate 事件监听 back 和next 按钮是否被 点击。