利用JavaScript实现禁用浏览器后退

最近做需求时出现的问题：

点击“意向国家和地区”对应的“请选择”，出现一个弹框，这个弹框可以选择国家和地区的弹框，弹框占据了一整个页面，当用户不想选择也就是不点击“确认”的时候，想按“返回”就直接返回到前一个页面 了，用户体验感差。

出现这样问题的原因：是因为弹框在当前页面，点击“返回”的时候，的确是返回上一页。

解决办法：
法一：把弹框写为二级页面，但这样改动的地方比较多，比较麻烦。
法二：在弹框显示的时候，JavaScript监听浏览器的返回事件，监听之后需要做两件事：禁止浏览器返回事件和关闭弹框。在弹框关闭时启用浏览器返回事件。

查了很多资料怎么禁用浏览器返回事件。最终在这篇文章中找到了方法，这篇讲了三种方法，我试验之后，自己采用了终极方案。

1、回退后，产生一个前进事件。
这种方式，不算是一个满意的解决方式。因为用户能体验到，界面的后退，前进。体验不好。

<script language="JavaScript"> 
javascript:window.history.forward(1); 
script>

3、终极方案：
也是查找了好多资料才找到的，这种方式，可以消除 后退的所有动作。包括 键盘、鼠标手势等产生的后退动作。

   现在，我们项目中就使用了第三种方式。在常用浏览器中，都可以禁用了后退。

//禁用浏览器返回
function fobidden_back() {
//防止页面后退
history.pushState(null, null, document.URL);
window.addEventListener(‘popstate’,back_common)
}
//启用浏览器返回
function enable_back() {
history.go(-1);
window.removeEventListener(‘popstate’,back_common)
}
function back_common() {
history.pushState(null, null, document.URL);
}