How to make an HTML back link

Question

What is the simplest way to create an  lt a gt  tag that links to the previous web page  Basically a simulated back button  but an actual hyperlink  Client-side technologies only  please   Edit Looking for solutions that have the benefit of showing the URL of the page you re about to click on when hovering  like a normal  static hyperlink  I d rather not have the user looking at history go -1  when hovering on a hyperlink  Best I ve found so far is    x000D   x000D   lt script gt  x000D    document write   lt a href      document referrer      gt Go Back lt  a gt     x000D   lt  script gt  x000D   x000D   x000D    Is document referrer reliable  Cross-browser safe  I ll be happy to accept a better answer

User · Answer

This solution gives you the best of both worlds

Users get to hover over the link to see the URL
Users don't end up with a corrupted back-stack

More details in the code comments below.

_x000D_

var element = document.getElementById('back-link');_x000D_
_x000D_
// Provide a standard href to facilitate standard browser features such as _x000D_
//  - Hover to see link_x000D_
//  - Right click and copy link_x000D_
//  - Right click and open in new tab_x000D_
element.setAttribute('href', document.referrer);_x000D_
_x000D_
// We can't let the browser use the above href for navigation. If it does, _x000D_
// the browser will think that it is a regular link, and place the current _x000D_
// page on the browser history, so that if the user clicks "back" again,_x000D_
// it'll actually return to this page. We need to perform a native back to_x000D_
// integrate properly into the browser's history behavior_x000D_
element.onclick = function() {_x000D_
  history.back();_x000D_
  return false;_x000D_
}

_x000D_

<a id="back-link">back</a>

_x000D_

User · Answer

lt a href     onclick  history back     gt Back lt  a gt

User · Answer

A back link is a link that moves the browser backwards one page  as if the user had clicked the Back button available in most browsers  Back links use JavaScript  It moves the browser back one page if your browser supports JavaScript  which it does  and if it supports the window history object  which is necessary for back links   Simple ways are   lt a href     onClick  history go -1   gt Go Back lt  a gt    OR    x000D   x000D  function goBack     x000D    window history back   x000D    x000D   lt a href     onclick  goBack      gt Go Back lt  a gt  x000D   x000D   x000D    Generally speaking a back link isn t necessary    the Back button usually suffices quite nicely  and usually you can also simply link to the previous page in your site  However  sometimes you might want to provide a link back to one of several  previous  pages  and that s where a back link comes in handy  So I refer you below tutorial if you want to do in more advanced way   http   www htmlcodetutorial com linking linking famsupp 108 html

User · Answer

history go -1  doesn t work if you click around in the 2nd domain or if the referrer is empty  So we have to store the historyCount on arriving to this domain and go back the number of navigations in this side minus 1      if referrer is different from this site if   document referrer includes window location host          store current history length   localStorage setItem  historyLength      history length           Return to stored referrer on logo click document querySelector  header  logo   addEventListener  click           gt     history go Number localStorage getItem  historyLength    - history length -1

User · Answer

And another way    x000D   x000D   lt a href  javascript history back    gt Go Back lt  a gt  x000D   x000D   x000D

User · Answer

The best way using a button  is   lt input type   button  onclick  javascript history back   return false   value  Back  gt

User · Answer

You can also use history back   alongside document write   to show link only when there is actually somewhere to go back to    lt script gt    if  history length  gt  1        document write   lt a href  javascript history back    gt Go back lt  a gt          lt  script gt

User · Answer

The easiest way is to use history go -1    Try this    x000D   x000D   lt a href     onclick  history go -1   gt Go Back lt  a gt  x000D   x000D   x000D

User · Answer

try this   lt a href  javascript history go -1   gt  Go Back  lt  a gt

User · Answer

This solution has the benefit of showing the URL of the linked-to page on hover  as most browsers do by default  instead of history go -1  or similar    lt script gt      document write   lt a href      document referrer      gt Go Back lt  a gt      lt  script gt

User · Answer

For going back to previous page using Anchor Tag  lt a gt   below are 2 working methods and out of them 1st one is faster and have one great advantage in going back to previous page   I have tried both methods   1    lt a href     onclick  location href   document referrer  return false   gt Go Back lt  a gt    Above method  1  works great if you have clicked on a link and opened link in a New Tab in current browser window   2    lt a href  javascript history back    gt Go Back lt  a gt    Above method  2  only works ok if you have clicked on a link and opened link in a Current Tab in current browser window   It will not work if you have open link in New Tab   Here history back   will not work if link is opened in New Tab of web browser

User · Answer

you can try javascript   lt A HREF  javascript history go -1   gt    refer JavaScript Back Button  EDIT  to display url of  refer http   www javascriptkit com javatutors crossmenu2 shtml  and send the element a itself in onmouseover as follow   x000D   x000D  function showtext thetext    x000D    if   document getElementById  x000D      return x000D    textcontainerobj   document getElementById  tabledescription   x000D    browserdetect   textcontainerobj filters    ie    typeof textcontainerobj style MozOpacity     string     mozilla       x000D    instantset baseopacity  x000D    document getElementById  tabledescription   innerHTML   thetext href x000D    highlighting   setInterval  gradualfade textcontainerobj    50  x000D    x000D    lt a href  http   www javascriptkit com  onMouseover  showtext this   onMouseout  hidetext    gt JavaScript Kit lt  a gt  x000D   x000D   x000D    check jsfiddle

[javascript] How to make an HTML back link?

Examples related to javascript

Examples related to html

Examples related to hyperlink