使用jQuery簡單更改語言實現代碼

我想用jQuery實現一個非常簡單的MUI。嘗試了幾個插件，但他們都在改變具有特定ID，類名或數據屬性的標籤內的語言。我需要通過{％translateme％}之類的簡碼翻譯界面。使用jQuery簡單更改語言實現代碼

我使用的HTML代碼是：

<div>{%projects%}</div> 
<input type="text" placeholder="{%tasks%}"/> 
<div><a href="#" id="en">English</a> | <a href="#" id="fr">French</a></div>

我的jQuery是：

var english = { 
    "projects": "Projects", 
    "tasks": "Tasks", 
}; 

var french = { 
    "projects": "Projets", 
    "tasks": "Tâches", 
}; 

$(document).ready(function() { 
    $("#en").click(function(){ 
      console.log('changeLanguage English'); 
     //changeLanguage function 
    }); 
}); 
$(document).ready(function() { 
    $("#fr").click(function(){ 
      console.log('changeLanguage French'); 
     //changeLanguage function 
    }); 
});

默認情況下，我需要的，如果可能加載英語。

請找到實例上的jsfiddle這裏：https://jsfiddle.net/g1hpkphg/2/

爲您的幫助提前感謝。

來源

2017-10-20 qqruza

您必須明白，「短代碼」只是DOM中的純文本節點，而不是像通常在模板引擎中完成的那樣可替換的文本塊。

由於這種差異，您需要定義一種方法來將這些可轉換的片段查找到DOM中，而對於DOM來說，最小的片斷是一個節點。因此，使用一些節點（html標籤是最容易找到的）來定義可翻譯的文本片段將幫助您解決您的任務。例如，你可以嘗試使用例如span與像data-屬性：<span data-locale="projects">Projects</span>，然後你就可以這樣做：

$('[data-locale]').each(function(){ 
    var $this = $(this); 
    $this.text(locales[locale][$this.data('locale')]); 
})

在我的例子locales是區域設置標識符作爲密鑰，並且本地化字符串作爲值的對象。 locale是當前語言環境的標識符。與訪問不同語言環境的不同變量相比，操作更簡單。

來源

2017-10-20 09:14:21 Flying

使用jQuery簡單更改語言實現代碼

回答

相關問題