Onclick javascript para fazer o navegador voltar à página anterior?

252

Existe uma função que eu possa anexar como um evento de clique de um botão para fazer o navegador voltar à página anterior?

<input name="action" type="submit" value="Cancel"/>
javascript html browser onclick dom-events Doc Holiday
fonte
7
window.history.back ()
John Strickler

Respostas:

447

Adicione isso ao seu elemento de entrada

<input
    action="action"
    onclick="window.history.go(-1); return false;"
    type="submit"
    value="Cancel"
/>
rogerlsmith
fonte
52
Isso não funciona em todos os navegadores para mim. Eu tive que fazer o seguinte <input action="action" type="button" value="Back" onclick="window.history.go(-1); return false;" />Esta resposta é bastante antiga, portanto, poderia ter sido um problema introduzido em versões mais modernas de navegadores. :)
ctrlplusb
4
Isso mostra a página anterior do cache ou recarrega a página anterior do servidor?
Adrien
7
Para que action="action"serve? E é html válido?
ban-geoengineering
@Adrien - seu javascript, por isso está sendo executado no navegador. O navegador deve reutilizar a página em cache (assumindo que as configurações do navegador e as configurações do cabeçalho http da página permitem isso).
Home
Observe que o JS embutido não deve ser usado na produção porque: 1. O código JS deve estar em .jsarquivos dedicados e minificados 2. O JS embutido deve ser desativado por meio de uma Política de segurança de conteúdo para mitigar as injeções de XSS
Theophany
120 
history.back()

ou

history.go(-1)

Coloque isso na onclickalça do botão . Deve ficar assim:

<input name="action" onclick="history.back()" type="submit" value="Cancel"/>
Vadim
fonte
11
Coloque isso no botão onClick handle
Vadim
7
Você pode ser mais claro, como dar a resposta no código #
WowThatsLoud 17/05
3
Qual é o suporte do navegador nisso?
Costa
98

Para Ir para a página anterior

Primeiro método

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

Segundo método

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

se quisermos dar mais de um passo para trás, aumente 

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.......
Rizwan Gill
fonte
2
@ JeromeJ, é um link que não faz nada se o JavaScript não estiver ativado / funcionando (por qualquer motivo) na página. Se o JavaScript estiver funcionando, o navegador retornará uma página.
precisa
14 
<input name="action" type="submit" value="Cancel" onclick="window.history.back();"/>
hspain
fonte
12

Você só precisa chamar o seguinte:

history.go(-1);
Rich O'Kelly
fonte
12

Mais curto ainda!

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

http://jsfiddle.net/qXrbx/

Eu prefiro o .go(-number)método como antes, para 1 ou muitas 'costas', há apenas 1 método para usar / lembrar / atualizar / pesquisar, etc.

Além disso, o uso de uma marca para um botão Voltar parece mais apropriado do que marcas com nomes e tipos ...

Michael Durrant
fonte
11

window.history.back ();

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

<script>
function goBack() {
    window.history.back();
}
</script>
Malik Khalil
fonte
8

Simples. Uma linha.

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

Como a resposta de Wim e Malik, mas apenas em uma linha.

Andre Mesquita
fonte
Funciona bem, mas, muitas vezes, se o usuário decide mudar idioma na página específica com o botão assim, o botão voltar para a página anterior vai virar as costas linguagem, em vez de página ...
Marek Bernad
6

Essa é a única coisa que funciona em todos os navegadores atuais:

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

Funciona para mim o tempo todo

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