Solução simples para o Botão Voltar do Ajax, Cross Browser

Galera, para consertar o botão voltar de sua aplicação use o Dynamic History, eu que fiz também (08/06/2007)

Dynamic History – Implementando

Mudanças

Versão 1.0

  • Botão Voltar Consertado
  • Botão Avançar Consertado
  • Testado e Suportado por IE7 e Firefox2

Versão 1.1

  • Botão Voltar Consertado
  • Botão Avançar Consertado
  • Botão Atualizar/Recarregar Consertado
  • Bookmarking Consertado
  • Problema na hora de voltar ao estado inicial
  • Testado e Suportado por IE6, IE7, Firefox2 e Opera9

Versão 1.2

  • Botão Voltar Consertado
  • Botão Avançar Consertado
  • Botão Atualizar/Recarregar Consertado
  • Bookmarking Consertado
  • Bug consertado: Passar parâmetros pelo Ajax
  • Bug consertado: Estado inicial da página. (Dica do Rangel)
  • Testado completamente (Voltar, Avançar, Bookmarking e Atualizar) e Suportado por IE6, IE7, Firefox2 e Opera9
  • Bookmarking Tests vá até o antigo projeto público.

Versão 1.3

  • Botão Voltar Consertado
  • Botão Avançar Consertado
  • Botão Atualizar/Recarregar Consertado
  • Bookmarking Consertado
  • Bug consertado: Passar parâmetros pelo Ajax
  • Bug consertado: Estado inicial da página. (Dica do Rangel)
  • Bug consertado: 2 estágios/cliques eram necessários para voltar à página no Firefox
  • Novidade: É possivel mudar valores de algumas variáveis
  • Testado completamente (Voltar, Avançar, Bookmarking e Atualizar) e Suportado por IE6, IE7, Firefox2 e Opera9
  • Bookmarking Tests abaixo, para ver as screenshots vá até o novo projeto público.

Dynamic History – Atual

Anúncios

75 Responses to Solução simples para o Botão Voltar do Ajax, Cross Browser

  1. JulioGreff disse:

    É, esse botão voltar está dando o que falar… O pessoal tá bem louco atrás da melhor solução. Gostei da sua idéia, não tinha pensado nisso. Como diz o Dekassegui, passamos a bola adiante mais uma vez. Vou dar uma analisada, e aí a gente vê se melhora,se é que é possível… Um colaborando com o outro, e mais passos em frente!!! Valeu aí, Bernardo!

  2. Então Julio, eh assim que vai pra frente, já tem 3 colaboradores :D… hauha
    Flwss

  3. Reginaldo Sousa disse:

    Muito bom..
    é bom ver a comunidade reunida buscando uma solução para um determinado problema..
    Parece que vocês estão no caminho certo.
    Parabéns a vc, ao Júlio e ao Cau.

  4. Thiago disse:

    posta o codigo completo do teste ai pra gente

  5. Thiago, coloquei no ar uma página com os códigos, vai lá.
    E escrevi também no post como implementar.

  6. Micox disse:

    “[…] Porém agora, após uma longa briga travada por 3 paladinos do ajax (Bernardo Rufino, Julio Greff e Cau Guanabara), parece que finalmente está saindo uma solução definitiva: Solução simples para o Botão Voltar do Ajax, Cross Browser. […]”
    AJAX – botão voltar: A solução >> El Micox
    (Ops para o anterior)

  7. Rangel disse:

    Olá Amigo!!!, Fiz e refiz e não consegui implementar no meu site… nele eu tenho a seguinte situação… um botão pesquisar q lista em um grid meus dados… escolho um dado e clico para ir para uma outra pagina.. apartir nesta outra pagina implementei o codio… ele volta mas o grid não aparece na posição q estava!!! o que posso estar fazendo de errado?

  8. Rangel,
    Desculpe a demora, o problema era realmente um bug, já foi corrigido, peço que pegue o código de novo. Desculpe o incomodo, e valeu por alertar!
    Estado Inicial da Página Corrigido!

  9. JulioGreff disse:

    É, estou brigando mais um pouco com o IE aqui em casa, e estou criando (copiando, modificando) uma outra solução, utilizando os mesmos princípios, mas com JSON, para facilitar a implementação. Em breve… Valeu aí, Bernardo!

  10. É isso aeww! Não senti a necessidade de criar baseado em objetos, 2 funções já resolveram, mas vai com tudo, esperamos novidades! Flwss

  11. Pablo Davi disse:

    Olá, estou usando e tentando entender todo o codigo que voces criaram, tipo eu queria fazer com que a pagina index abrisse direto ja puxando um link, tentei colocar “onLoad(“ajax(‘home.htm’); return false;” dentro da tag body da pagina inicial para puxar esse arquivo ja no onload mas nao deu certo. existe alguma forma de fazer isso com esse codigo? vlw Bernardo…

  12. Geraldo disse:

    Bernardo…. pelo que eu vi, sua solução é exatamente oq eu to precisando… habilita botão voltar, tudo… e eu posso usar links… tipo index.php por exemplo. O do Julio, se eu tento usar um hash tipo, ‘conteudo’, ele da erro.

    Cara, mas os arquivos do codigo.. tao fora, nao consigo baixar. queria estudar esse codigo seu…. ta de parabens mesmo cara!

    Teria como vc disponibilizar os arquivos do codigo pra gente novamente? ou se der pra me enviar no e-mail geraldoabreu@gmail.com

    Agradeço desde já cara!

  13. Pablo Davi,
    É, na tag body num dá, porque olha só, todos os objetos só serão iniciados quando a janela ser carregada(window.onload), então como o body carrega antes é necessário colocar junto do window e não no body, é só colocar no final “ajax(‘home.htm’);” como você quiser, fica mais ou menos assim:
    window.onload=function(){criaElementos(); verificaInt=setInterval(“verifica()”, 100); ajax(‘home.htm’);}
    Geraldo,
    O Servidor devia estar fora, já está online se quiser ver os códigos tente ir aqui. Mas de qualquer jeito já te enviei um email com os dois arquivos ajaxBack.js e o control.htm.

  14. Galera, comenta! Ainda to ativo! Qualquer coisa é só falar que respondo, ok?

  15. preciso de uma explicação de como usar esse negócio, pq assim eu não entendi

  16. Bernardo… cara gostei, vlw pela solução… já tinha lido muito sobre isso, e agora sim uma solução de verdade!!!

  17. Marcelo Dênis,
    Pode falar, estamos aí..

    Marcelo Siqueira,
    Opa Valeu kra, vlw mesmo!!

  18. Geraldo disse:

    Caro Bernardo… Novamente, meus parabéns pelo script, rs.

    Olha… vi aqui algo que poderia ser melhorado no script….

    Quando você clica em um link, a pessoa escuta 4 sons de clique… Principalmente quando o site está local, e os sons de clique são mais pertos, fica um pouco desconfortavel…

    Isso, é claro, como sempre, no IE, pelo menos no 6.

    Teria como mudar isso? Posso estar sendo meio louko, rs… pode ser uma coisa absurda que não tem como, mas diz aê pra gente! Abraços!

  19. Davi disse:

    Cara interessante pra caramba a solução…

    Agora queria saber como faço para implementar quando todos os links que tenho são para chamar uma função ajax que acessar uma unica pagina php que tem todas as funções e retorna o conteudo, pelo o semplo que vi, teria que ter as paginas php para funcionar…

  20. Geraldo,
    Ehh, mas aqui eu ouço 2 cliques, é chato de conseguir mudar pois um clique é quando muda o iFrame e outro é quando muda o Hash… To estudando outro metodo mais simples.
    Valew!

    Davi,
    Vc tá falando que quer chamar uma função especificamente em uma página cheia de funções?
    Se for faz com GET, vc envia qual função vc quer e faz o php retornar o resultado de acordo com o parametro…

    Flwss

  21. Geraldo disse:

    Chato demais eu, mas lá vai mais uma, rs. Como eu coloco pra abrir automático? É coisa boba… mas tô apanhando… Tipo assim, quando abrir a página, já aparecer a home entendeu.

  22. Ahh sim, veja aqui mesmo nos comentários, respondi para o Pablo Davi

  23. Geraldo disse:

    Opa.. perfeito! Não tinha visto… Obrigado pela paciência, rs.

    Tô aqui tentando fazer um esquema para, caso o cara digite um endereço direto, tipo… home.php, ele detecte isso, e recarregue a página no formato que o seu script reconhece… para que assim, a página seja aberta do jeito certo.

    E Bernardo, vi que vc não colocou créditos no script… Sugiro que você coloque, assim você se tornará mais conhecido…

    Abraços!

  24. Geraldo disse:

    Bernardo… no negócio que te falei acima… tentei fazer isso:

    Mas não rola… Eu entro vamos supor, em localhost/ajax/teste2.php e sou redirecionado para localhost/ajax/#[page]teste2.php . Aí a página é aberta corretamente. Só que em seguida, ela é recarregada… O script está sendo executado duas vezes, sei lá…

    Existiria alguma forma de fazer isso em javascript?

    É mais ou menos a mesma coisa que vc faz por exemplo, quando eu digito a página principal, e aí já abre a home por exemplo…. Só q não consegui adaptar… pode dar um Help?

    Abraços!

  25. Geraldo disse:

    Bom, só pra consta, consegui fazer algo… usando javascript:

    function verificaURL()
    {

    var url = location.href;
    var newurl = “”;

    if(!(url.indexOf(‘#[page]’) > -1))
    {
    var ar = url.split(‘/’);

    for(i = 0; i

    Colocado em alguma página, tipo no exemplo q eu falei, teste2.php, caso essa página seja acessada diretamente, automaticamente o navegador é redirecionado para a página no formato correto, para que abra dentro do Ajax, usando o script do Bernado.

  26. Geraldo,
    Desculpe pela demora da resposta, tava analisando o que disse e não consegui entender bem, você diz que quando você entra numa página que inicialmente é estática e não tem requisição feita ao abrir, ele recarrega ela? Estranho, não consegui reproduzir, você não está passando nenhum Hash para ela?
    To analisando um método mais simples..
    Flwss e obrigado por usar o script! hehe

  27. Geraldo disse:

    Tipo assim, eu tenho a página teste2.php . Se eu acesso ela diretamente… digitando localhost/ajax/teste2.php no navegador, ela abre fora do ajax… certo? Já que não passei hash nenhum….

    Esse script que eu consegui fazer… se vc colocar ele nessa página teste2.php, e tentar acessar ela diretamente, o script detecta isso, e manda a pessoa para o endereço localhost/ajax/#[page]teste2.php , ou seja, o endereço da página acessada, mas passando hash… Aí seu script reconhece, e abre dentro do ajax… Entendeu?

    Tá bem pequeno o script… acho que rola legal…. acima ele cortou. Segue abaixo o completo:

    function verificaURL()
    {
    // Define variável que contém a url completa da página
    var url = location.href;
    // Define variável que irá conter a nova url
    var newurl = “”;

    if(!(url.indexOf(‘#[page]’) > -1))
    {
    var ar = url.split(‘/’);

    for(i = 0; i

  28. Geraldo disse:

    Putz…. o script tá cortando. vou mandar pro seu mail, aí se vc quiser dar uma olhada para integrar com seu script….

    Abraços!

  29. Ok, recebido…
    Agora entendi, muito boa idéia! Vou ver o que posso faer para ver se é possivel integrar. Pois talve algumas pessoas não consigam mapear quais URLs são para serem abertas pelo Ajax ou não. Enfim, muito boa idéia Parabééééns!

    Flwss

  30. Valter disse:

    Alguem poderia mandar para meu e-mail contato@menegaro.com uma solução para o botão voltar, obrigado.

  31. Vicente Domingos disse:

    Estou usando a solução para o botão voltar desenvolvida pelo Bernardo Rufino. Tudo funciona bem em links que não tenham âncoras, mas ao posicionar a âncora ela desabilita o botão voltar o qual deixa de funcionar.

    Sendo assim, tenho o seguinte:

    Tenho essa página atual (último link chamado):
    http://localhost:8080/aplicacao/#pasta/Arquivo131.html

    Dentro dela chamo essa (com âncora):
    http://localhost:8080/aplicacao/#pasta/Arquivo112.html#12

    Então, quando carregada, a página posiciona-se no item 12 e, então, temos o seguinte location:
    http://localhost:8080/aplicacao/#12

    Após esse location o Botão Voltar pára de funcionar normalmente, não chama mais os arquivos do histórico – só continua mostrando o histórico.
    Entretanto, se eu chamar outra página que não tenha âncoras, ele volta a funcionar.
    O problema é somente quando o link tem âncoras.

    Alguém tem alguma idéia de como resolver?

    Obs.: para chamar âncoras em Ajax utilizo a seguinte lógica:
    Conforme código, abaixo, após o carregamento e o innerHtml – coloco o document.location.href = ancora.
    Pronto, o documento carregado por Ajax é posicionado no lugar desejado.

    if (xmlhttp.status==200)
    {
    respostaServicoSolicitado=xmlhttp.responseText;
    //Exibe a resposta do servidor no local desejado
    document.getElementById(idDestino).innerHTML=respostaServicoSolicitado;
    if (ancora!=”)
    {
    document.location.href = ancora;
    }
    }

    Entretanto, como o ‘document.location.href =ancora’, está causando esse problema,
    estou procurando outro comando que me faça posicionar no local desejado através do id ou name do elemento.
    Nesse caso, já tentei o seguinte:

    var anc = document.getElementsByName(ancora);
    anc.focus(); //não funcionou.

    Estou apelando (hehehehe), mas a idéia era dar foco ao objeto cujo id ou name está na variável ancora.

    Alguém conhece algum comando que produza o resultado que estou procurando e que não seja o ‘document.location.href’.
    Ou, se o for, como resolver esse problema da desabilitação do Botão Voltar?

    Vicente Domingos

  32. Vicente Domingos disse:

    Desculpem, onde se lê: document.location.href =ancora’, leia-se document.location.hash =ancora’

    Vicente Domingos

  33. […] as visitas e os leitores de feed, tem muitas visitas pra 2 posts em especial, são eles: o botão voltar do ajax e como zerar a contagem do rapidshare e afins, esses então vem copia cola e vai. Fica dificil […]

  34. Carlos disse:

    Uma pergunta… o google analytics detecta o clique?

    Pq eu queria alterar isso na minha página só por causa disso… pra ter as stats do analytics q sao importantes pra mim.

  35. Glenda disse:

    Olá, Bernardo!

    Estou iniciando neste assunto…ajax! Gostaria de saber se o código disponibilizado para utilizar no botão voltar é possível ser utilizado quando se carrega um arquivo .html em div. Pelo que vi você cria iframes…Não sei como utilizar…gostaria de obter apenas o código do botão voltar. É possível?

    Aguardo retorno.

    Obrigada
    Glenda

  36. Carlos,
    Acho que será dificil pois o Google Analytics se não me engano detecta as características da página via Js, então seriam as mesmas da página com os links pras chamadas ao invés de cada página chamada ser diferente.
    Glenda,
    É para isso mesmo, solucionar o botão voltar em requisições Ajax, você fixa uma requisição padrão em um elemento, e só muda a url que será exibida, essa solução que fiz não inclui suporte a Ajax.

  37. Alexandre Fabre disse:

    Bernardo,
    Antes de mais nada parabéns pelo código, excelente, me foi muito útil!!!!

    Estou desenvolvendo um site em HTML com menu em flash, e para evitar o reflash estou utilizando o código do MICOX em conjunto com o seu. No Mozilla e no Netscape ele está funcionando 100%, mas quando no internet explorer 7 a página não carrega. O que poderia estar ocorrendo já que estou utilizando seu código conforme a instrução de vocês nos foruns??? No botão flash para carregar a página estou utilizando por exemplo:

    on (release) {
    getURL(“javascript:ajax(‘home.html’)”, “_self”);
    }

    A minha Id está

    e os botões em HTML coloquei:
    Home

    Coloquei o site provisioriamente em:

    http://www.fabiosoares.net/LWCC/

  38. micox disse:

    Ae grande bermon, se tiver como trocar o link do iEvolution aqui também :),
    agora é ievolutionWeb.com

    valeus.

  39. […] fazemos a navegação via JavaScript (o maior problema com Ajax): a do Cau Guanabara, a minha, a do Bermonruf, além de outras derivações juntando pedaços das três. Agora eu volto aqui não para criar uma […]

  40. Rafael Frota disse:

    Ele não reconhece outros scripts

  41. Rafael Frota disse:

    Como faço para carregar duas páginas em locais diferentes?

  42. Hykiakkk disse:

    Thank you for your site.
    enterprise rentacar niederheim enterprisecarrental

  43. Rogerio disse:

    Olá Bernardo,

    Sou um pouco novo em ajax, e por isso não estou conseguindo colocar os códigos na pagina, index.php, q no meu caso é onde recebera o conteudo atravez do ajax nos div’s, eu estou desenvolvendo um sistema em php com xajax e gostaria q quando pressionasse a tecla F5 ou clicasse no botao voltar, q a pagina nao voltasse à index inicial, se vc, ou alguem puder me ajudar…

  44. jaisoN niehueS disse:

    Olá amigo, parabens pelo código.
    Não consegui utilizá-lo em testes que fiz aqui, utilizo uma função para carregar o ajax, exemplo:
    ajaxCarrega(“id_destino”, “arquivo.php”), como citado anteriormente.

    Ela já tem várias chamadas no sistema todo, gostaria de saber senão tem como adicionar uma chamada para a sua função dentro desta função que já está implementada e funcionando.

    Algo como salvaHistorico(); dentro desta ajaxCarrega();

    Algo mais genérico iria ajudar muita gente por aqui.

    Mais uma vez parabéns.

  45. jaisoN,
    Ainda não dá, mas a solução mais simples é renomear sua função antiga e redefinir a que registra o histórico com o mesmo nome da antiga.

  46. Jonatan disse:

    Parabéns, muito útil!!
    Porém estou com um problema igual ao do jaisoN.
    Tentei fazer essa solução que vc falou de renomear a antiga e na nova chamar
    Mas ele entra num loop infinito e fica gerando este erro:
    Erro: uncaught exception: [Exception… “Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIXMLHttpRequest.open]” nsresult: “0x80070057 (NS_ERROR_ILLEGAL_VALUE)” location: “JS frame :: http://pop-sc.rnp.br/js/ajax.js :: anonymous :: line 136″ data: no]

    Tentei tbm ao invés de renomear, eu pegar o que o código dentro da função e colocar nessa nova, mas tbm não deu!

    Alguém tem alguma sugestão?

    A biblioteca AJAX que eu to usando é essa:
    – Simple AJAX Code-Kit (SACK) v1.6.1
    http://www.twilightuniverse.com

  47. Jonatan disse:

    Só pra exemplificar o que eu tenho:

    function ajax_loadContent(divId,url) {
    /*Código para instanciação do objeto da classe ajax.js
    que define a mensagem enquanto está carregando,
    o ID de onde carregar, o arquivo, etc. */
    }

    O que eu fiz então foi renomear essa função, e chamar ela nesta:

    ajax_loadContent = onnavigate(“ajax”, function(id_destino,arquivo_carregar) {
    loadContent(id_destino,arquivo_carregar); //Função anterior renomeada
    });

    Teoricamente era pra funcionar, mas como eu falei ele gera aquele erro bizarro infinitas vezes obrigando a fechar a página.

  48. Jonatan
    A função que servirá de callback só aceita um parametro que será uma string transportada entre cada chamada ao Hash ou iFrame. O ideal para esses tipos de requisição é escolher um elemento que você deseja e consertar o histórico somente com as chamadas Ajax para esse elemento, ou então terá que fazer tratamento de String.

  49. Jonatan disse:

    Valeu Bernardo! Fiz o tratamento de String e deu certo!! :D

    Só mais uma dúvida:
    Eu tenho todas as chamadas da função de carregamento através do evento onclick do elemento ‘‘.
    E deste jeito tá funcionando. =/
    Preciso trocar todas as chamadas para o parametro href??
    Se tiver, eu vou ter problemas com um menu JS que tenho no site. =/

  50. Jonatan disse:

    Bom, acabei trocando as chamadas no sistema todo (do onclick para o href) e deu certo!
    Porém, pra variar, surgiu outro problema: (¬¬) No IE não tá funcionando! (Testei apenas na versão 6 ainda).
    Ele não chega a gerar erro, mas simplesmente fica carregando carregando carregando…
    To saindo do trampo agora, mas amanhã vou verificar o que pode estar acontecendo, mas se alguém já teve esse problema e sabe como resolver, ficaria mto grato! =P
    O site que to desenvolvendo é este: http://www.pop-sc.rnp.br

  51. Jonatan disse:

    Consegui resolver esse último problema apenas trocando a ordem da chamada/importação dos scripts na página! oO
    Mas é claro que agora to com outro problema né? Hehe.. Sou mto azarado mesmo!
    O erro dessa vez é o Refresh no FF que não tá funcionado! =/

  52. Morderfeuer disse:

    Coloquei no meu site, mas vive dando pau no Atualizar (principalmente no Firefox.. tem vezes que funciona e outras que não.. =/)
    E parece que ele guarda as páginas em cache, e isso dá problema quando vc precisa que a página precise ser recarregada, no meu caso é assim:
    Eu tenho uma página que quando o usuário tá logado, exibe uma tabela e um formulário para alteração dos dados desta tabela, e quando não está logado, exibe apenas alguns dados da tabela.
    Acontece então que quando eu entro nesta página logada, ele exibe certinho, aí eu deslogo e entro novamente, e ele mistura as informações exibidas (da página qdo tá logado e não)
    Quem sabe na próxima versão vcs consigam resolver esse probleminha, mas de resto estão de parabéns! Muito boa a iniciativa!

  53. Cledson disse:

    oi. Muito boa sua solução. Tenho so um problema.
    Tentei utilizá-la em um site, onde são carregados muitos conteúdos no início.
    Bom, no firefox, funciona perfeitamente, mas no IE, se clicarmos nos links, ele interrompe e dá um erro, dizendo que o “iframe” é um objeto nulo. E esse erro só acontece se não esperarmos todo conteúdo do site carregar. Há algum modo de evitar isso? Ou teria de fazer um preload de todo conteúdo?
    Obrigado

  54. Eduardo disse:

    Olá Bernardo, tudo certo?

    Apliquei seu codigo junto com um ajax simplinho que tenho aqui e deu tudo certo no ie7 e FF2.0, porém no ie6 nao.

    Estou usando flash como menu. Se quiser dar uma olhada no projeto que estou desenvolvendo com a sua solução acesse http://www.webgreat.com.br/lasetronik

    Obrigado.

  55. Otimo! Estava procurando algo neste sentido.
    Para resolver meu problema com o AJAX.

    Hoje chegando em casa, vou bolar uma função para pode usar o ajax com mais parâmetros fazendo tratamento de string.

    Se tudo de certo eu posto o código aqui, abraço para todos!

  56. Guilherme Camargo Cardoso disse:

    Implementei em um site e funcionou que é um beleza!!!

    Só tive que fazer poucas alterações para evitar conflitos com o prototype.js .

    Se alguém chegar até aqui com o mesmo problema eis como ficou o código:

    /**
    *
    * @author Bernardo Rufino
    * @license Creative Commons Developing Nations: http://creativecommons.org/licenses/devnations/2.0/
    * @version 0.8
    * @description Script to add dynamic navigating functionality, it’s framework independent
    *
    * !Não retire essas informações!
    * !Do not drop this information!
    */

    //Just like the prototype, it returns a function wrapped in a context

    //CÓDIGO comentado, PARA SER USADO JUNTO COM O PROTOTYPE

    /*Function.prototype.bind = function(context){
    var closure = this;
    var tmp_fnc = function(){
    return closure.apply(context, arguments);
    }
    return tmp_fnc;
    }

    Object.prototype.merge = function(object){
    for(attr in object){
    this[attr] = object[attr];
    }
    }*/

    document.navigators = {
    settings: {
    interval: 100, //The interval which the verification for new data will be done (in miliseconds)
    helper: true, //Specify if the onnavigate function will return the helper, do not change!
    iframe_src: “control.htm” //The location of the file control.htm, absolute path please
    },
    initialize: function(){
    this.is_ie = (navigator.userAgent.toLowerCase().indexOf(“msie”) > -1) ? true : false;
    if(this.is_ie){
    this.settings.iframe_src = this.settings.iframe_src.replace(/(\?|#).*$/, “”);
    window.attachEvent(“onload”, (function(){
    //this.running = true; The iFrame that needs to make it running
    this.iframe = document.createElement(“iframe”);
    this.iframe.setAttribute(“src”, this.settings.iframe_src);
    this.iframe.style.display = “none”;
    document.getElementsByTagName(“body”)[0].appendChild(this.iframe);
    }).bind(this));
    } else {this.running = true;}
    },
    //The function that is called by the user and puts new data in the hash to be called
    helper: function(data, force){
    var navs = document.navigators; var data = “[” + this.id + “]” + data;
    if(force){navs.data_buffer = “”;} //If force is true then calling sequentially the same helper works
    if(navs.is_ie){navs.iframe.src = navs.settings.iframe_src + “?id=” + data;}
    else{window.location.hash = “#” + data;}
    },
    called: false,
    history: [],
    data_buffer: “”
    };

    function onnavigate(id, callback){
    var navs = document.navigators; navs[id] = {};
    if(!navs.running){navs.initialize();}
    setInterval(function(){if(navs.running){
    var url = window.location.href;
    var hash = window.location.hash.replace(/#/, “”);
    var theid = “#[” + id + “]”;
    if(url.indexOf(theid) > -1){ //If the call is with us!
    var data = url.split(theid)[1] || “”;
    var new_data = theid + data;
    if(navs.data_buffer != new_data){ //If the old content is diferent
    callback(data); //Calling the callback function!
    navs.called = true; //To make sure was already called to fix the index state
    navs.history.push(new_data);
    navs.data_buffer = new_data;
    }
    } else if (!hash && navs.called){ //If the navigators was called and the page is in index state (no hashes), it means reload!
    navs.running = false; //To stop the others Intervals to dont make it the same way and broke something
    window.location = ((url.indexOf(“#”) > -1) ? url.split(“#”)[0] : url) + “#”;
    window.location.reload();
    }
    }}, navs.settings.interval);

    //CÓDIGO ALTERADO, PARA SER USADO JUNTO COM O PROTOTYPE começa aqui
    navs[id].merge = function(object){
    for(attr in object){
    this[attr] = object[attr];
    }
    }
    //CÓDIGO ALTERADO , PARA SER USADO JUNTO COM O PROTOTYPE termina aqui

    navs[id].merge({callback: callback});
    if(navs.settings.helper){
    navs[id].helper = navs.helper.bind({id: id}); return navs[id].helper;
    }
    }

  57. Leandro disse:

    Boa tarde. Esse código do botão voltar funciona em servidor Windows?

  58. Eric disse:

    olá estou começando a utilizar seus scripts, e ocorreu um problema no internet explorer 6 e com flash, quando se coloca o flash para chamar a função request_source. Se você clicar várias vezes no botão ele abre a url que está no getURL por cima do site.

  59. Joao Felipe disse:

    Respondendo a alguns que tiveram problemas com menus em flash e a navegação ajax… Eu vinha tendo esse problema a muito muito tempo… como não havia nenhuma solução eu fazia uma verificação dos browsers para que apenas o IE6 pulasse a navegação… ou seja, no IE6 nao funcionava a navegaçao com o botao voltar e os links pois dava erro usando menu em Flash

    Depois de tanto pensar e 5 sites com a mesma implementação consegui a solução… basta usar a função ExternalInterface do flash no lugar da getUrl… qualquer duvida entra em contato comigo atraves do contato do meu website.. http://www.joaofelipe.net

  60. Plinio Duarte disse:

    Caros! ouvi muito falar desse componente, e gostaria de tirar uma dúvida.
    No meu site eu tenho uma pesquisa de hotéis, e nessa página eu tenho uma função navegar(npg) que chama uma função ajax passando uma série de outros parámetros. Gostaria que me desse uma luz de como chamo a função navegar(npg) utilizando o componente do Bernardo.
    se puder dar uma olhada: http://www.falaturista.com.br/pesquisarhoteis.php?filtro=&cmbcidade1=2615648 fico muito grato.

  61. Leandro Silva disse:

    opa galera, num funciona com o ajax do asp.net, alguém sabe pq?

    abraço, e obrigado.

  62. Rafael Brito disse:

    Bom dia,

    eu tenho um site que eu faço a chamada do ajax em varias div’s (tenho uma principal, mas tenho outras q eu chamo para facilitar para o usuario na hora de cadastrar um novo cliente, por exemplo).

    mas no código q vcs criaram ele sempre procura por uma div só… como eu poderia fazer para chamar essa função somente qdo eu chamar pela div principal?

    nao sei se me expliquei bem, mas qq coisa eu posso exemplificar.

    fico no aguardo

  63. Ola Bernado Rufino, muito boa a sua solução, so que ainda estou tendo alguns bugs no IE7, não esta salvando o historico corretamente, ja no firefox funciona tudo ok, sera que pq estou usando a versao 0.8? acima vi os releases das versoes 1.0, 1.1, 1.2, 1.3 como faço pra baixar essas versoes mais recente?

    Abraço Companheiro

  64. WeepBerpave disse:

    Just went through your pages. There are very few things like my adaptable silver I have a nice joke for you) What is always behind time? (besides myself) The back of a watch.

  65. […] fazemos a navegação via JavaScript (o maior problema com Ajax): a do Cau Guanabara, a minha, a do Bermonruf, além de outras derivações juntando pedaços das três. Agora eu volto aqui não para criar uma […]

  66. MireAdere disse:

    mm… really like it..

  67. Prilady disse:

    Só ressaltando, a solução do Guilherme Camargo Cardoso para a Prototype também serve para a JQuery e Mootools, testei todas as duas no meu site… Valeu Guilherme! Salvou minha pele!

  68. Marcus disse:

    Boa tarde, como faço para fazer funcionar um botão voltar criado pelo sistema, que nem no GMAIL?

  69. Marcus disse:

    Faltou eu dizer que é através do Dynamic History.

  70. Marcus disse:

    Descobri qual foi o problema. Foi a tag que está envolvendo a div.

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

%d blogueiros gostam disto: