How can I stop the browser back button using JavaScript?

Question

I am doing an online quiz application in PHP. I want to restrict the user from going back in an exam.

I have tried the following script, but it stops my timer.

Answer 1

I create one HTML page ( index.html ). I also create a one ( mechanism.js ) inside a ( script ) folder / directory. Then, I lay all my content inside of ( index.html ) using form, table, span, and div tags as needed. Now, here's the trick that will make back / forward do nothing!

First, the fact that you have only one page! Second, the use of JavaScript with span / div tags to hide and display content on the same page when needed via regular links!

Inside ' index.html ' :

    
     
      
       IN 
      
     
     [ 0 ]
    

Inside ' mechanism.js ' :

    function DisplayInTrafficTable()
    {
     var itmsCNT = 0;
     var dsplyIn = "";
     for ( i=0; i" + inTraffic[i] + "" + entryTimeArray[i] + "" + entryDateArray[i] + "";
     }
     document.getElementById('inOutSPN').innerHTML = "" +
                                             "" + dsplyIn.toUpperCase() + "
INCOMING TRAFFIC REPORT
" + DateStamp() + "  -  PRINT
###
ID #
TYPE
FIRST
LAST
PLATE #
COMPANY
TIME
DATE
IN / OUT
" +
                                             "";
     return document.getElementById('inOutSPN').innerHTML;
    }

It looks hairy, but note the function names and calls, embedded HTML, and the span tag id calls. This was to show how you can inject different HTML into same span tag on same page! How can Back/Forward affect this design? It cannot, because you are hiding objects and replacing others all on the same page!

How to hide and display? Here goes: Inside functions in ' mechanism.js ' as needed, use:

    document.getElementById('textOverPic').style.display = "none"; //hide
    document.getElementById('textOverPic').style.display = "";     //display

Inside ' index.html ' call functions through links:

and

    Introduction

I hope I did not give you a headache. Sorry if I did :-)