Como usar a função onPopState

[Andrew Marques 47]

Bom dia pessoal,

 

tenho um script para trocar conteudo da página com Ajax:

 

$(document).ready(function(){
var content = $('#portfolio');

//pre carregando o gif
loading = new Image(); loading.src = 'img/loading.gif';
$('#trabalho a').on('click', function( e ){
	e.preventDefault();
	content.html( '<div class="img_loading"><img src="img/loading.gif" /> Carregando</div>' );

	var href = $( this ).attr('href');
	$.ajax({
		url: 'trabalhos.php',
		success: function( response ){
			//forçando o parser
			var data = $( '<div>'+response+'</div>' ).find('#'+href).html();
				//apenas atrasando a troca, para mostrarmos o loading
			window.setTimeout( function(){
				content.fadeOut('slow', function(){
					content.html( data ).fadeIn();
				});
			}, 1000 );
		}
	});
    });
});

 

Preciso que depois que trocar eu possa também voltar para a página antiga, nosso amigo William Bruno postou que da pra fazer com history.back e onPopState mas não sei como fazer, alguem me ajuda?

 

Obrigado!

[Evandro Oliveira 331]

Na verdade é pushState, não popState...

 

http://wbruno.com.br/ajax/window-history-pushstate-javascript-trocando-url-usando-api-html5-em-paginas-carregadas-ajax/

http://diveintohtml5.info/history.html

https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history

[Andrew Marques 47]

Alterei para isso aqui:

 

window.setTimeout( function(){
   content.fadeOut('slow', function(){
      content.html( data ).fadeIn();
						
      window.history.pushState(href);
   });
}, 1000 );

 

Está correto?

 

Pra voltar para anterior é só usar window.history.back(); ??

[Evandro Oliveira 331]

1. Não, não está correto. pushState recebe três parâmetros, você só passou um.

 

2. Sim, depois de arrumar você pode fazer com [inline]history.back()[/inline] que funciona.

[Andrew Marques 47]

Entendo bem pouco de JS..

 

Seria isso entao?

 

window.setTimeout( function(){
   content.fadeOut('slow', function(){
      content.html( data ).fadeIn();
						
      window.history.pushState(data, 'Voltar', href);
   });
}, 1000 );

[Evandro Oliveira 331]

Deve servir

[Andrew Marques 47]

Não deu certo =(

 

Usei o history.back() e voltou para página anterior (diretorio) e nao voltou o conteudo que estava...

 

Me da uma força por favor...

[Evandro Oliveira 331]

[inline]history.pushState(null, null, href);[/inline]

 

Verifique se não há erros no console.

 

Qual a versão do navegador em uso??

 

O endereço na barra de títulos é alterado??

[Andrew Marques 47]

O titulo não é alterado...

 

Quando clico no botão para voltar, ele não volta nada, fica na mesma página, dai eu clico denovo ai ele volta um diretorio...

Resolvi!!

 

Envez de voltar, fiz ele exibir o conteudo da index que preciso... ficou meio gambiarra mas nao faz mal haha :joia: