Onclick javascript to make browser go back to previous page?

Question

Is there a function I can attach as a click event of a button to make the browser go back to previous page?

<input name="action" type="submit" value="Cancel"/>

window.history.back() – John Strickler Nov 09 '11 at 15:48 — John Strickler, Nov 09 '11 at 15:48

score 540 · Accepted Answer · edited Mar 09 '20 at 08:22

540

Add this in your input element

<input
    action="action"
    onclick="window.history.go(-1); return false;"
    type="submit"
    value="Cancel"
/>

edited Mar 09 '20 at 08:22

kartikluke

2,375
1
19
32

answered Nov 09 '11 at 15:45

rogerlsmith

6,670
2
20
25

57

This doesn't work in all browsers for me, I had to do the following `` This answer is quite old, so it could have been an issue introduced into more modern versions of browsers. :) – ctrlplusb May 29 '14 at 10:49
5

Does this show the previous page from cache or reloads the previous page from the server? – Adrien Apr 28 '16 at 07:57
9

What's the `action="action"` part for? And is it valid html?? – ban-geoengineering Apr 26 '17 at 18:34
@Adrien - its javascript, so it is running in the browser. The browser should reuse cached page (assuming browser settings and page http header settings permit doing so). – ToolmakerSteve Apr 30 '19 at 14:42
Note that inline JS should not be used in production because: 1. JS code should be in dedicated and minified `.js` files 2. inline JS should be disabled through a Content Security Policy to mitigate XSS injections – CheddarLizzard Apr 08 '20 at 12:25
1

Any idea why this not always working from the first time? It doesn't seem that [this question](https://stackoverflow.com/questions/20034274/duplicate-history-enteries-using-history-pushstate-in-chrome-safari) was answered so far. – Halfist May 18 '20 at 12:59

score 158 · Answer 2 · edited Dec 03 '19 at 09:46

158

history.back()

or

history.go(-1)

Put this to the button onclick handle. It should look like this:

<input name="action" onclick="history.back()" type="submit" value="Cancel"/>

edited Dec 03 '19 at 09:46

ˈvɔlə

9,204
10
63
89

answered Nov 09 '11 at 15:44

Vadim

5,154
2
20
18

11

Put this to the button onClick handle – Vadim Nov 09 '11 at 15:44
7

You could be more clear like giving the answer in the code – WowThatsLoud May 17 '16 at 12:57
3

What's the browser support on that? – Costa Michailidis Apr 26 '17 at 04:07
1

@Costa [pretty good](https://caniuse.com/?search=history), unless you're developing to Opera Mini. – Diego Fortes May 20 '21 at 02:32

score 114 · Answer 3 · answered Jun 03 '13 at 10:52

114

For Going to previous page

First Method

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

Second Method

<a href="##" onClick="history.go(-1); return false;">Go back</a>

if we want to more than one step back then increase

For going 2 steps back history.go(-2)
For going 3 steps back history.go(-3)
For going 4 steps back history.go(-4)
and so on.......

answered Jun 03 '13 at 10:52

Rizwan Gill

2,193
1
17
29

2

@JeromeJ it is a link that does nothing if JavaScript isn't enabled/working (for whatever reason) on the page. If JavaScript is working, it takes the browser back one page. – Jeromy French Apr 05 '16 at 19:04

score 17 · Answer 4 · edited Mar 09 '20 at 08:46

17

Works for me everytime

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

edited Mar 09 '20 at 08:46

CroMagnon

1,218
7
20
32

answered Oct 14 '19 at 13:04

Mannu saraswat

1,061
8
15

score 16 · Answer 5 · answered May 12 '18 at 20:01

16

Simple. One line.

<button onclick="javascript:window.history.back();">Go Back</button>

Like Wim's and Malik's answer, but just in one line.

answered May 12 '18 at 20:01

Andre Mesquita

879
12
25

Works fine, but oftentimes if user decides to change language on specific page with the button like this, the back button to previous page will turn the language back, instead of page... – Marek Bernád Dec 03 '19 at 06:59

score 16 · Answer 6 · answered Nov 09 '11 at 15:44

16

<input name="action" type="submit" value="Cancel" onclick="window.history.back();"/>

answered Nov 09 '11 at 15:44

hspain

17,528
5
19
31

score 14 · Answer 7 · answered Nov 29 '16 at 10:05

14

window.history.back();

<button onclick="goBack()">Go Back</button>

<script>
function goBack() {
    window.history.back();
}
</script>

answered Nov 29 '16 at 10:05

Malik Khalil

6,454
2
39
33

Michael Durrant · Answer 8 · 2011-11-09T16:20:02.650

14

Shortest Yet!

<button onclick="history.go(-1);">Go back</button>

http://jsfiddle.net/qXrbx/

I prefer the .go(-number) method as then, for 1 or many 'backs' there's only 1 method to use/remember/update/search for, etc.

Also, using a tag for a back button seems more appropriate than tags with names and types...

edited Nov 09 '11 at 16:20

answered Nov 09 '11 at 16:14

Michael Durrant

93,410
97
333
497

score 12 · Answer 9 · answered Nov 09 '11 at 15:44

12

You just need to call the following:

history.go(-1);

answered Nov 09 '11 at 15:44

Rich O'Kelly

41,274
9
83
114

score 7 · Answer 10 · answered Aug 24 '21 at 12:31

7

Access window.history and then call back()

window.history.back()

answered Aug 24 '21 at 12:31

Gaurav Patil

1,162
10
20

some of the others didn't take me to the previous page if I had reloaded, but this one does – Josh McGee Nov 25 '21 at 14:39

score 6 · Answer 11 · answered Jan 26 '17 at 13:57

6

This is the only thing that works on all current browsers:

<script>
function goBack() {
    history.go(-1);
}
</script>
<button onclick="goBack()">Go Back</button>

answered Jan 26 '17 at 13:57

Wim Mostrey

277
5
8

score 1 · Answer 12 · answered Feb 17 '21 at 18:15

1

the only one that worked for me:

function goBackAndRefresh() {
  window.history.go(-1);
  setTimeout(() => {
    location.reload();
  }, 0);
}

answered Feb 17 '21 at 18:15

DevTheJo

2,179
2
21
25

score 1 · Answer 13 · edited Sep 07 '22 at 07:00

1

You could use one of the following :

history.back() or window.history.back()

You also go back to N number of pages with this one
history.go(-1)

edited Sep 07 '22 at 07:00

Raphaël Balet

6,334
6
41
78

answered Sep 03 '22 at 23:48

Taib Islam Dipu

437
4
10

1

Isn't `history.back()` the same as `history.go(-1)` & `window.history.back()` ? Please do add a bit more of context – Raphaël Balet Sep 05 '22 at 11:53
The window.history object can be written without the window prefix, that's why history.back(), history.go(-1) & window.history.back() will do the same. but if we want to go back to N number of pages then history.go(-n) can use. example: history.go(-1) will go 1 page back from current, history.go(-2) will go 2 pages back from the current. Thanks Raphaël Balet. – Taib Islam Dipu Sep 06 '22 at 23:06

score -1 · Answer 14 · answered Jul 30 '20 at 02:37

-1

100% work

<a onclick="window.history.go(-1); return false;" style="cursor: pointer;">Go Back</a>

answered Jul 30 '20 at 02:37

Fezal halai

756
7
14

Onclick javascript to make browser go back to previous page?

14 Answers14

Linked

Related