使用Javascript或jquery的多语言页面

目前我正在开发支持多种语言的网络应用程序。 因此，我在我的数据库中准备了翻译表。 但是，我不确定如何使用翻译填充Web应用程序。 在我看来，最简单的方法是在页面的每个元素中引用适当的翻译。 这在PHP中很有用我不知道如何使它在js或JQuery中工作。

我想要的是在div中对数组的引用，如下所示：

 {translation_array['login']}  

因此div会从translation_array中“获取”值，但我缺乏这样做的知识。 有可能让它以这种方式工作吗？

如果没有，我会很感激有关如何在js中制作多语言网页的建议。

谢谢

Answer 1

根据span语HTML标记的语言使用您想要更改的每一段文本，因为您可以在每一段HTML上嵌入内联（与div或p相反，它们具有display:block默认为display:block ）。 然后，对于每个span使用名称以特定模式开头的class ，例如：

然后使用jQuery的函数.each根据所选语言更改与其类名中的模式lang匹配的每个span标记。

我还在这里给你一个简单的例子来检查。

 var LanguageList = { "EN" : "English", "ES" : "Español", "PT" : "Português" }; //languages Objects var WORDS_EN = { "text1" : "text One", "text2" : "text Two" }; var WORDS_ES = { "text1" : "texto Un", "text2" : "texto Dos" }; var WORDS_PT = { "text1" : "texto Um", "text2" : "texto Dois" }; window.onload = initialize; function initialize() { var $dropdown = $("#country_select"); $.each(LanguageList, function(key, value) { $dropdown. append($(""). val(key). text(value)); }); loadsLanguage("EN"); } function loadsLanguage(lang){ /*fills all the span tags with class=lang pattern*/ $('span[class^="lang"]').each(function(){ var LangVar = (this.className).replace('lang-',''); var Text = window["WORDS_"+lang][LangVar]; $(this).text(Text); }); } 

 div{ margin: 15px; } 

    
  
 
  
 
 /