Hello Readers! Here is a small blog on how to disable the browser back button. Although it is not advisable to use such tricks in websites as restricting or disabling the browser back button can be annoying for users who might wish to go back to the previous page from the existing page. Though it is very useful in terms of security and integrity of online data.
Here we will create two HTML pages from where one page will call another page with the help of link and we will restrict the user from going back to previous page using the browser back button.
Step 1: HTML Page 1 code:
<!DOCTYPE html>
<html>
<head>
<title>Disable Browser Back Button Using JavaScript</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js">
</script>
</head>
<body>
<a href="Page2.html">Click Here!</a>
</body>
<script>
$(document).ready(function() {
function disableBack() {
window.history.forward()
}
window.onload = disableBack();
window.onpageshow = function(evt) {
if (evt.persisted) disableBack()
}
});
</script>
</html>
Step 2: HTML Page 2 code:
<html>
<body style="font-family:Arial;font-size:15px;">
Click the browser back button or hit the Backspace key.
</body>
</html>
The Javascript function "window.history.forward()" is used to achieve the target. This function uses the history of the browser and forces it to navigate forward instead of going back to the previous page.
0 Comment(s)