Using javascript history.back() fails in Safari .. how do I make it cross-browser?

I am using

<a href="" onclick="history.back();return false;">Back</a>

to provide a back to previous page link. It works fine on Windows (IE/Mozilla) but fails in Safari on both Windows/Mac.

Is there a way to make it work on all of the systems/browsers (cross-browser/platform)?

If it’s not possible, is there any other way using PHP etc?

it should be history.go(-1); return false;
history.go(-1); event.preventDefault();

You should consider doing it like this instead:

<a href="">Back</a>

Try this instead. It should work across IE, FF, Safari and Chrome.

<a href="#" onclick="if(document.referrer) {,'_self');} else {history.go(-1);} return false;">Cancel<a>

The below code is working.

<a href=";" onclick="javascript:history.go(-1);">Back</a>

If anyone is still struggling with this issue try removing the href-attribute from the link you want to use window.history.back() with. I’m not sure if this workaround complies with HTML-standards but it worked out fine for me.

I’ve faced the same issue recently, and although I’m not exactly sure why, this is the solution that worked for me:

If the user is on iOS:


If not:


I faced a similar issue on an e-commerce site I have been building for one of my customers. I initially went the route of calling:


when the button was clicked. I encountered the same problem you are having with cross compatibility issues.

Read More:   When to Use vm. or this. in Vue.js

To answer you question about

If it’s not possible, is there any other way using PHP etc?

My opinion is you should not invoke a method on the server to do a client operation. This is unnecessary overhead on your app and in my opinion, poor design/implementation.

Now to answer your main question:

Is there a way to make it work on all of the systems/browsers (cross-browser/platform)?

To solve the issue I found a client cookie library produced by Mozilla ( from another StackOverflow post (my apologies to the author – I don’t have the link to your post).

Using the library I create a cookie with a key of ‘back-url’ when the user navigates to the part of my app where I want them to be able to go back:

$('#id-of-button-clicked').click(function() {
    docCookies.setItem("back-url", window.location.href, "", "");

This code sets a cookie with a key-value pair ‘back-url’, and the current url and makes it accessible from the root directory of

Next, on the page where I want the user to be able to navigate back to the URL set in the cookie, I call the following code:

$(‘#id-of-back-button’).click(function() {
    window.location.href = docCookies.getItem('back-url');

This code sets the window location by getting the value of ‘back-url’.

Disclaimer: I am no professional js developer – just trying to put in my two cents from some lessons I have learned.

Challenges to this answer:

  • This answer uses cookies, many people don’t like the use of cookies. My customers requirements allow me to use cookies.
  • I’m not encrypting the cookie – some may consider this bad practice. I am still in the early implementation phase of our development. I am, however, restricting access to the cookie to only within our domain.
Read More:   Trying to pass in a boolean C# variable to a javascript variable and set it to true

The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .

Similar Posts