0

Estou usando o Google Translate no meu site, e está funcionando perfeitamente, porém ao atualizar a pagina ele retorna para linguagem padrão do site, os dados aparecem salvos no LocalStorage e mesmo assim ele não retorna a informação, o meu JS utilizado:

var comboGoogleTradutor = null;

function googleTranslateElementInit() {
   new google.translate.TranslateElement({
   pageLanguage: 'pt',
   includedLanguages: 'en,zh-CN,pt,de,es',
   layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL
  }, 'google_translate_element');

  comboGoogleTradutor = document.getElementById("google_translate_element").querySelector(".goog-te-combo");
 }

 function changeEvent(el) {
   if (el.fireEvent) {
    el.fireEvent('onchange');
    } else {
      var evObj = document.createEvent("HTMLEvents");
     evObj.initEvent("change", false, true);
     el.dispatchEvent(evObj);
     }
   }
 function trocarIdioma(sigla) {
   if (comboGoogleTradutor) {
    comboGoogleTradutor.value = sigla;
    changeEvent(comboGoogleTradutor);
    localStorage.setItem("linguagem atual", sigla);
     }
  }
  
window.onload = () => {
  const sigla = localStorage.getItem('linguagem atual');
  if (sigla) trocarIdioma(sigla);
} 

Em seguida o HTML utilizado:

        <div class="list-group list-custom-small">
            <a href="javascript:trocarIdioma('pt')"><img class="me-3 mt-n1" width="20" src="assets/img/translate/Brasil.png"><span>Português</span><i class="fa fa-angle-right"></i></a>
            <a href="javascript:trocarIdioma('en')"><img class="me-3 mt-n1" width="20" src="assets/img/translate/United-States.png"><span>Inglês (EUA)</span><i class="fa fa-angle-right"></i></a>
            <a href="javascript:trocarIdioma('de')"><img class="me-3 mt-n1" width="20" src="assets/img/translate/Germany.png"><span>Alemão</span><i class="fa fa-angle-right"></i></a>
            <a href="javascript:trocarIdioma('es')"><img class="me-3 mt-n1" width="20" src="assets/img/translate/Spain.png"><span>Espanhol</span><i class="fa fa-angle-right"></i></a>
            <a href="javascript:trocarIdioma('zh-CN')"><img class="me-3 mt-n1" width="20" src="assets/img/translate/China.png"><span>Chinês</span><i class="fa fa-angle-right"></i></a>             
        </div>
        <script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>  

1 Resposta 1

0
1. O comportamento do null da variável comboGoogleTradutor esta causando isso. Pelo código que você mostrou o null (um valor falsy) é passado pra função trocaIdioma quando ela é executada, então o javascript nem chega a procurar no localStorage.
var comboGoogleTradutor = null;

window.onload = () => {
  const sigla = localStorage.getItem('linguagem atual');
  if (sigla) {
comboGoogleTradutor = document.getElementById("google_translate_element").querySelector(".goog-te-combo");
    trocarIdioma(sigla);
  }
} 

function googleTranslateElementInit() {
   new google.translate.TranslateElement({
   pageLanguage: 'pt',
   includedLanguages: 'en,zh-CN,pt,de,es',
   layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL
  }, 'google_translate_element');

  comboGoogleTradutor = document.getElementById("google_translate_element").querySelector(".goog-te-combo");
 }

 function changeEvent(el) {
   if (el.fireEvent) {
    el.fireEvent('onchange');
    } else {
      var evObj = document.createEvent("HTMLEvents");
     evObj.initEvent("change", false, true);
     el.dispatchEvent(evObj);
     }
   }
 function trocarIdioma(sigla) {
   if (comboGoogleTradutor) {
    comboGoogleTradutor.value = sigla;
    changeEvent(comboGoogleTradutor);
    localStorage.setItem("linguagem atual", sigla);
     }
  }

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .