Using Javascript How to create a Go Back link that takes the user to a link if there s no history for the tab or window

Question

EDIT-2  None of the answers seem to work  Not even the one I previously marked as the answer of this question  Any help is appreciated  Thanks   First  I have googled for a how-to on creating a  Go Back  link that allows the user to return to the previous page  and these are two ways of doing it    lt a href  javascript history go -1   gt  Go Back  lt  a gt    and      lt a href     onclick  history go -1  return false   gt  Go Back  lt  a gt    Which of these two is a better choice  And why   Also  please shed some light on browser compatibility    That s one half of the question  Now if mine is the first page the user is visiting  the  Go Back  link wouldn t work  right   As there s no pre-existing history for the window or tab   In that case  I want the link to fallback and take the user to http   example com   i e  if history exists  the user is taken to the previous page  and if it doesn t he s taken to http   example com   How do I do that  Hope someone can help   EDIT  Please note that I do not know JavaScript  so kindly make your answer explanative  Thanks

User · Answer

How about using the history replacement function to add the site into the browsers history?

Try executing the following as soon as the window loads-

history.replaceState("example", "title", "http://www.example.com");

This should hopefully make it so even if it is the first page they have accessed, the URL you define in the code will be what they're taken to when they click back.

User · Answer

simply use cookies to store your visited page list   and apply some if else   EDIT  also use ServerVariables HTTP REFERER

User · Answer

both would work the same  its just two different methods to call the same function  Try the following    lt a href  javascript history back     gt  Go Back  lt  a gt

User · Answer

check window history length or simply  history length  EDIT  some browsers start their history with 0  others with 1  adjust accordingly   if it has a value of 1  it means it s the first page in that window tab - then you can have JS redirect you    lt script gt      function backAway              if it was the first page         if history length     1               window location    http   www mysite com             else               history back                     lt  script gt    lt a href     onClick  backAway    gt Back lt  a gt

User · Answer

You cannot check window history length as it contains the amount of pages in you visited in total in a given session   window history length  Integer  Read-only  Returns the number of elements in the session history  including the currently loaded page  For example  for a page loaded in a new tab this property returns 1  Cite 1  Lets say a user visits your page  clicks on some links and goes back   www mysite com index html  lt -- first page and now current page                   lt ----  www mysite com about html                                                             www mysite com about html privacy                                                      www mysite com terms html  lt -- user uses backbutton or your provided solution to go back  Now window history length is 4  You cannot traverse through the history items due to security reasons  Otherwise on could could read the user s history and get his online banking session id or other sensitive information  You can set a timeout  that will enable you to act if the previous page isn t loaded in a given time  However  if the user has a slow Internet connection and the timeout is to short  this method will redirect him to your default location all the time   window goBack   function  e       var defaultLocation    quot http   www mysite com quot       var oldHash   window location hash       history back       Try to go back      var newHash   window location hash          If the previous page hasn t been loaded in a given time  in this case       1000ms  the user is redirected to the default location given above        This enables you to redirect the user to another page              However  you should check whether there was a referrer to the current       site  This is a good indicator for a previous entry in the history       session              Also you should check whether the old location differs only in the hash        e g   index html top -- gt   index html  shouldn t redirect to the default       location              if          newHash     oldHash  amp  amp           typeof document referrer       quot string quot     document referrer       quot  quot                  window setTimeout function                   redirect to default location             window location href   defaultLocation            1000      set timeout in ms           if e           if e preventDefault              e preventDefault            if e preventPropagation              e preventPropagation              return false     stop event propagation and browser default event      lt span class  quot goback quot  onclick  quot goBack    quot  gt Go back  lt  span gt   Note that typeof document referrer       quot string quot  is important  as browser vendors can disable the referrer due to security reasons  session hashes  custom GET URLs   But if we detect a referrer and it s empty  it s probaly save to say that there s no previous page  see note below   Still there could be some strange browser quirk going on  so it s safer to use the timeout than to use a simple redirection  EDIT  Don t use  lt a href     gt     lt  a gt   as this will add another entry to the session history  It s better to use a  lt span gt  or some other element  Note that typeof document referrer is always  quot string quot  and not empty if your page is inside of a  i frame  See also   W3C  HTML5  5 4 2 The History interface

User · Answer

this seems to do the trick   function goBackOrGoToUrl              window history back        window location    http   example com        Call history back   and then change the location  If the browser is able to go back in history it won t be able to get to the next statement  If it s not able to go back  it ll go to the location specified

User · Answer

The reason on using the return false  is well explained on this other question   For the other issue  you can check for the referrer to see if it is empty       function backAway            if  document referrer            alternatively  window history length    0             window location    http   www example com             else               history back                      lt a href     onClick  backAway    gt Back Button Here  lt  a gt

User · Answer

You should use window variable - window referrer  This variable contains the last page the user visited if they got to the current page by clicking a link For example     function goBack         if document referrer          window location href   document referrer         return              window location pathname              This code redirect user to previous page if this is exist and redirect user to homepage if there isn t previous url

User · Answer

The following code did the trick for me   html    lt div class  back  onclick  goBackOrGoHome    gt    Back  lt  div gt    js   home url    YOUR BASE URL    pathArray   document referrer split         protocol   pathArray 0   host   pathArray 2    url before   protocol          host   url now   window location protocol          window location host    function goBackOrGoHome      if   url before    url now        window history back           else      window location   home url           So  you use document referrer to set the domain of the page you come from  Then you compare that with your current url using window location   If they are from the same domain  it means you are coming from your own site and you send them window history back    If they are not the same  you are coming from somewhere else and you should redirect home or do whatever you like

User · Answer

Added a new answer to display the code formatted   The thing is that you were checking for document referer  because you were in ff it was returning always true  then it was navigating to http   mysite com  Try the following   function backAway        if  document referrer              firefox  chrome  etc           i   0        else              under ie         i   1            if  history length gt i                   there are items in history property         history back          else           window location    http   www mysite com              return false

User · Answer

You need to check both document referrer and history length like in my answer to similar question here  https   stackoverflow com a 36645802 1145274

User · Answer

echo   lt p gt  lt a href   javascript history go -1    title   Return to previous page   gt  amp laquo Go back lt  a gt  lt  p gt      Will go back one page   echo   lt p gt  lt a href   javascript history go -2    title   Return to previous page   gt  amp laquo Go back lt  a gt  lt  p gt      Will go back two pages

[javascript] Using Javascript: How to create a 'Go Back' link that takes the user to a link if there's no history for the tab or window?

Examples related to javascript

Examples related to html