How to detect if the user clicked the "back" button

Question

When the user goes history-back-1...how do I detect that? And then, alert "the user clicked back!"

Using binds (and jQuery preferably)

Alex, you just asked a similar question at http://stackoverflow.com/questions/2008765/in-javascript-perferably-jquery-how-do-i-add-something-to-the-url-when-the-user Don't spam. — Justin Johnson, Jan 05 '10 at 20:25
Possible duplicate of [In Javascript, preferably JQuery, how do I add something to the URL when the user clicks "back" button in the browser?](https://stackoverflow.com/questions/2008765/in-javascript-preferably-jquery-how-do-i-add-something-to-the-url-when-the-use) — Brian Tompsett - 汤莱恩, Aug 25 '19 at 17:25

EricLaw · Accepted Answer · 2013-10-08T21:03:31.097

25

You generally can't (browser security restriction). You can tell if the user navigates away from the page (onbeforeunload, onunload fire) but you can't tell where they went unless you've set up your page to allow it.

HTML5 introduces the HTML5 History API; in conforming browsers, the onpopstate event will fire if the user navigates back to an earlier "page" on your site.

edited Oct 08 '13 at 21:03

answered Jan 05 '10 at 20:25

EricLaw

55,769
7
146
189

What about this? http://stackoverflow.com/questions/10462511/is-there-a-way-using-jquery-to-detect-the-back-button-being-pressed-cross-browse – Timo Huovinen Oct 08 '13 at 19:49
3

You can construct pages in such a way that hitting back is detectable, but the only way you can know where they went is if they happened to navigate to another page on your site (where you control the JavaScript). How to construct such a scenario? When the user visits "PageA.htm" you immediately send them to "PageB.htm" and if they load "PageA.htm" again, you can "guess" that they've hit "Back." – EricLaw Oct 08 '13 at 21:00

score 8 · Answer 2 · answered Jan 05 '10 at 20:26

8

try:

window.onbeforeunload = function (evt) {
  var message = 'Are you sure you want to leave?';
  if (typeof evt == 'undefined') {
    evt = window.event;
  }
  if (evt) {
    evt.returnValue = message;
  }
  return message;
}

answered Jan 05 '10 at 20:26

Adnan

24,852
17
77
108

2

OnBeforeUnload will also fire if the user goes to some other site. – EricLaw Oct 08 '13 at 21:04
1

is there any way to not display the alert message? – Mohammad Faisal Sep 28 '15 at 13:49

score 6 · Answer 3 · answered Mar 29 '13 at 12:38

6

window.onpopstate=function()
{
  alert("Back/Forward clicked!");
}

answered Mar 29 '13 at 12:38

Mohsen Haeri

162
2
7

7

This will not fire if you visit **another** page and then come back to this page. – Pacerier Apr 06 '15 at 07:09

score 0 · Answer 4 · edited Aug 22 '16 at 23:32

0

Following are the steps to detect back button click

Register a mouse down event on body $('body').on('mousedown' ,'on all li' );

2.Now set a variable when mousedown event occur.

3.Check this variable when your location changes.

IF variable chages to true it means list cliked otherwise backbutton

This work in my usecase .This solution may helps others because it depends on app design

edited Aug 22 '16 at 23:32

KANAYO AUGUSTIN UG

1,877
1
14
27

answered Sep 22 '15 at 05:39

Saurabh Ahuja

473
3
13

Miranda · Answer 5 · 2013-10-01T19:00:03.987

-3

On the page you are looking at, you can add this piece of code to the onLoad event to move them back the page they were on.

if(history.length>0)history.go(+1)

If you want the alert then make it

if(history.length>0)alert("the user clicked back!")

edited Oct 01 '13 at 19:00

answered Oct 01 '13 at 18:29

Miranda

79
9

Won't work for anything. `history.length > 0` will give you true even when its a brand new page. It gives you the [entire length of history](http://stackoverflow.com/a/9757655/632951) **including** the backwards and forwards pages. – Pacerier Apr 06 '15 at 07:20

How to detect if the user clicked the "back" button

5 Answers5

Linked