web系統多語言切換(中文,英文,日文)
阿新 • • 發佈:2019-02-17
1,下載語言切換所需要的js jquery.localize.js http://webscripts.softpedia.com/script/Modules/jQuery-Plugins/jQuery-localizationTool-js-83407.html
2,在web.xml中新增程式碼,攔截json格式資料,配置檔案是json檔案
<servlet-mapping> <servlet-name>default</servlet-name> <url-pattern>*.json</url-pattern> </servlet-mapping>
3,定義三個json檔案,text-zh.json,text-ja.json,text-en.json(中文需要轉義 防止可能出現亂碼)
(1)text-en.json
{
"acc": {
"HelpCenter": "Help center",
"BusinessCenter": "Business Center",
"Exit": "[Exit]",
"BusinessSupport": "Business Support"
}
}
(2)text-zh.json
(3)text-ja.json{ "acc": { "HelpCenter": "幫助中心", "BusinessCenter": "商家中心", "Exit": "[退出]", "BusinessSupport": "商家支援" } }
{
"acc": {
"HelpCenter": "ヘルプセンター",
"BusinessCenter": "商家センター",
"Exit": "[名目]",
"BusinessSupport": "企業支援"
}
}
4,語言切換 jsp頁面新增
<select id="ddlSomoveLanguage" onchange="chgLang();"> <option value="zh">選擇</option> <option value="zh">中文</option> <option value="en">ENGLISH</option> <option value="ja">日本語</option> </select>
5,在需要切換的地方引入對應的方法 data-localize="acc.HelpCenter"
<a data-localize="acc.HelpCenter" href="$!webPath/articlelist_help.htm">幫助中心</a>
6,寫一個language-coockies.js 檔案,$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language:"en"});pathPrefix表示json檔案路徑的字首,text和en對應檔名text-en.json
var name = "somoveLanguage";
/*server*/
var ctx = window.document.location.href.substring(0,window.document.location.href.indexOf(window.document.location.pathname));
function chgLang() {
var value = $("#ddlSomoveLanguage").children('option:selected').val();
SetCookie(name,value);
location.reload();
}
function SetCookie(name,value){
var Days = 30; //此 cookie 將被儲存 30 天
var exp = new Date(); //new Date("December 31, 9998");
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getCookie(name)//取cookies函式
{
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null) return unescape(arr[2]); return null;
}
$(function() {
var uulanguage = (navigator.language || navigator.browserLanguage).toLowerCase();
if (uulanguage.indexOf("en") > -1) {
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "en"});
}else if (uulanguage.indexOf("zh") > -1) {
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "zh"});
}else if (uulanguage.indexOf("ja") > -1) {
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "ja"});
}else{
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "zh"});
};
if (getCookie(name) != "") {
if (getCookie(name) == "zh") {
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "zh"});
}
if (getCookie(name) == "en") {
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "en"});
}
if (getCookie(name) == "ja") {
$("[data-localize]").localize("text", {pathPrefix: ctx+"/resources/lang", language: "ja"});
}
}
});
7,