今天上网时,看到了一个禁用浏览器后退的十分简单的实现。特向大家推荐下。
功能如下:点击键盘上的退格键或点击浏览器的后退键时,依然停留在本页。(当然了,禁止后退时的操作可以根据需要自己定义)
原理:当父页面跳转到子页面后,若在子页面执行后退操作,则自动跳回子页面(或根据需要执行自己需要的操作)。
父页面代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
| <HTML> <HEAD> <TITLE>Disable Back Button in Browser - Online Demo</TITLE> <STYLE> body, input{ font-family: Calibri, Arial; } </STYLE> <script type="text/javascript"> window.history.forward(); function noBack(){ window.history.forward(); } </script> </HEAD> <BODY onload="noBack();" onpageshow="if (event.persisted) noBack();" onunload=""> <H2>Demo</H2> <p>This page contains the code to avoid Back button. </p> <p>Click here to Goto <NoBack Page 2> </p> <p>Click here to Goto <NoBack Page 3> </p> </BODY> </HTML>
|
各个子页面代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14
| <HTML> <HEAD> <TITLE>NoBack - Disable Back Button in Browser</TITLE> <STYLE> body, input{ font-family: Calibri, Arial; } </STYLE> </HEAD> <BODY> <H2>Welcome to NoBack Page</H2> <p>Press Browser's Back button </BODY> </HTML>
|
上述代码在以下环境测试通过:
Chrome Version 23.0.1262.0 dev-m
FireFox 17.0a2 (2012-09-17)
IE 8