Question

我正在创建多语言索引页面，并且正在创建lang更改区域，当我单击每种语言的文本时，它都会更改。

当我单击我的语言链接（AZ，EN，RU）时，它会更改语言，但是在重新加载页面后，它不会更改语言。

主要是我想在页面重新加载后缓存onclick函数。

我也想使用纯JavaScript。

这是我的代码：

var voc = [
            {
              "AZ":"Log in2",
              "EN":"Log in",
              "RU":"Log in3"
            }
          ];


function translate(ele,lng){
 for(var i=0;i<voc.length;i++){
  for(var k in voc[i]){
   if(voc[i][k] == ele.innerText.trim()){
    ele.innerText = voc[i][lng];
    break;
   }
  }
 }
}
function translateTo(lng){
var trc = document.getElementsByClassName("trans");
for(var i=0;i<trc.length;i++){
translate(trc[i],lng);
}
}
//add this function to any event button.click,select.change or on load
//translateTo("AR");

function under1(){
  document.getElementsByClassName("lang")[0].style = "text-decoration:underline;";
  document.getElementsByClassName("lang")[1].style = "text-decoration:none";
  document.getElementsByClassName("lang")[2].style = "text-decoration:none";
}

function under2(){
  document.getElementsByClassName("lang")[0].style = "text-decoration:none;";
  document.getElementsByClassName("lang")[1].style = "text-decoration:underline";
  document.getElementsByClassName("lang")[2].style = "text-decoration:none";
}

function under3(){
  document.getElementsByClassName("lang")[0].style = "text-decoration:none;";
  document.getElementsByClassName("lang")[1].style = "text-decoration:none";
  document.getElementsByClassName("lang")[2].style = "text-decoration:underline";
}

.langselect a{
text-decoration:none;
}

.langselect a:nth-child(2){
text-decoration:underline;
}

<p>
<span class='trans'>Log in</span> 
</p>

<p class="langselect">
<a href="" class="lang" onclick='translateTo("AZ"); under1(); return false;'>AZ</a>
<a href="" class="lang" onclick='translateTo("EN"); under2(); return false;'>EN</a>
<a href="" class="lang" onclick='translateTo("RU"); under3(); return false;'>RU</a>
</p>

Answer 1

答案将是使用cookie：

window.onbeforeunload = function() {
    document.cookie = "lang=AU"; //For example. You can choose to add the language whichever way you want.
}

然后在页面加载时：

window.onload = function() {
    window.getCookie = function(name) {
        var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
        if (match) {
            return match[2]
        };
}

由@JonathanCamenisch提供的答案的第二部分。

在多语言页面上使用for onclick元素进行缓存

1 个答案: