I don't understand why in Firefox, window.history.back()
does work on a button:
<button onclick=window.history.back()>Go back</button>
But it does not work for a link:
<a onclick=window.history.back()>Go back</a>
What is the difference?
An example illustrating this:
index.html
<!DOCTYPE html>
<html>
<body>
<h1>First page</h1>
<br/>
<a href=second.html>Second</a>
</body>
</html>
second.html
<!DOCTYPE html>
<html>
<body>
<h1>Second page</h1>
<a href=third.html>Third</a>
<br/>
<br/>
<button onclick=window.history.back()>Go Back (button)</button>
<br/>
<a href=javascript: void(0); onclick=window.history.back()>Go Back (a)</a>
</body>
</html>
third.html
<!DOCTYPE html>
<html>
<body>
<h1>Third page</h1>
<br/>
<button onclick=window.history.back()>Go Back (button)</button>
<br/>
<a href=javascript: void(0); onclick=window.history.back()>Go Back (a)</a>
</body>
</html>
Scenario:
- Run index.html and click Second.
- On second.html click Third.
- On third.html click Go back (a).
- On second.html click Go back (a). Boom! I'm on the third.html, and not on the first.html!!!
Plunker example (Note! Run it on Firefox)
If you use Go back (button) it works. What is the difference in <a onclick
and <button onclick
in this case?