js使用i18n實(shí)現(xiàn)頁面國際化的方法
更新時(shí)間：2017年05月09日 09:14:55 作者：LH9898
本篇文章主要介紹了js使用i18n實(shí)現(xiàn)頁面國際化的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
頁面引用的插件
<script type="text/JavaScript" src="${path}/plugings/jQuery-easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${path}/js/jquery.i18n.properties.min.js"></script>
以下是頁面引用的js
/**
* 設(shè)置語言類型： 默認(rèn)為中文
*/
var i18nLanguage = "zh-CN";
/*
設(shè)置一下網(wǎng)站支持的語言種類
zh-CN(中文簡體)、en(英語)
*/
var webLanguage = ['zh-CN', 'en'];
//獲取網(wǎng)站語言
function getWebLanguage(){
//1.cookie是否存在
if (jQuery.cookie("userLanguage")) {
i18nLanguage = jQuery.cookie("userLanguage");
console.log("language cookie is "+i18nLanguage);
} else {
//2.1 獲取用戶設(shè)置的瀏覽器語言
var navLanguage = getNavLanguage();
console.log("user set browser language is "+navLanguage);
if (navLanguage) {
// 判斷是否在網(wǎng)站支持語言數(shù)組里
var charSize = $.inArray(navLanguage, webLanguage);
if (charSize > -1) {
i18nLanguage = navLanguage;
// 存到緩存中
jQuery.cookie("userLanguage ",navLanguage, {
expires : 7
});
};
} else{
console.log("not navigator");
return false;
}
}
}
//國際化easyui中英文包
function changeEasyuiLanguage(languageName) {
// when login in China the language=zh-CN
var src =$.contextPath+"/plugings/jquery-easyui/locale/easyui-lang-"+languageName.replace('-','_')+".js";
console.log(src);
$.getScript(src);
};
/**
* 執(zhí)行頁面i18n方法
* @return
* @author LH
*/
var execI18n = function(){
//獲取網(wǎng)站語言(i18nLanguage,默認(rèn)為中文簡體)
getWebLanguage();
//國際化頁面
jQuery.i18n.properties({
name : "common", //資源文件名稱
path : $.contextPath+"/i18n/"+i18nLanguage+"/", //資源文件路徑
mode : 'map', //用Map的方式使用資源文件中的值
language : i18nLanguage,
cache:false, //指定瀏覽器是否對(duì)資源文件進(jìn)行緩存,默認(rèn)false
encoding: 'UTF-8', //加載資源文件時(shí)使用的編碼。默認(rèn)為 UTF-8。
callback : function() {//加載成功后設(shè)置顯示內(nèi)容
//以下是將要國際化的文字內(nèi)容
//退出
$("#logOut").html($.i18n.prop('logOut'));
//用戶
$("#loginUser").html($.i18n.prop('loginUser'))
}
});
}
/*頁面執(zhí)行加載執(zhí)行*/
$(function(){
/*執(zhí)行I18n翻譯*/
execI18n();
console.log("網(wǎng)站語言： "+i18nLanguage);
//國際化easyui
changeEasyuiLanguage(i18nLanguage);
});
國際化的文件存放路徑，zh-CN表示簡體中文；en表示英語；也可擴(kuò)展其它語言，只要在i18n文件夾下添加對(duì)應(yīng)的文件;key要一一對(duì)應(yīng),value則是文字的語言內(nèi)容
中文的common.properties文件內(nèi)容
login.userName=Username login.passWord=Password login.sub=Login login.reset=Reset login.anonymous=Anonymous
英文的common.properties文件內(nèi)容
login.userName=Username login.passWord=Password login.sub=Login login.reset=Reset login.anonymous=Anonymous
以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
這篇文章主要介紹了Web3.js查詢以太幣和代幣余額以及轉(zhuǎn)賬,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-09-09
基于JavaScript操作DOM常用的API小結(jié)
DOM（Document Object Model）即文檔對(duì)象模型，針對(duì) HTML 和 XML 文檔的 API（應(yīng)用程序接口）。本篇文章給大家介紹javascript操作dom常用的api小結(jié)，對(duì)javascript dom api相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2015-12-12
js中將多個(gè)語句寫成一個(gè)語句的兩種方法小結(jié)
js中將多個(gè)語句寫成一個(gè)語句的兩種方法講述了逗號(hào)運(yùn)算符將多個(gè)語句寫成一個(gè)語句以及花括號(hào)寫成一個(gè)語句的實(shí)現(xiàn)方法,需要的朋友可以參考一下2007-12-12
這篇文章主要介紹了javascript常用函數(shù)，15個(gè)常用函數(shù)，都具有很高的實(shí)用性，感興趣的小伙伴們可以參考一下2015-11-11
JS實(shí)現(xiàn)間歇滾動(dòng)的運(yùn)動(dòng)效果實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)間歇滾動(dòng)的運(yùn)動(dòng)效果,涉及javascript定時(shí)器觸發(fā)動(dòng)態(tài)改變頁面元素的相關(guān)操作技巧,需要的朋友可以參考下2016-12-12
實(shí)例分析JS中的相等性判斷===、 ==和Object.is()
這篇文章主要給大家介紹了關(guān)于JS中相等性判斷===、 ==和Object.is()的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用JS具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
這篇文章主要為大家詳細(xì)介紹了js+css實(shí)現(xiàn)紅包雨效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-07-07
這篇文章主要為大家詳細(xì)解析了Sortable.js拖拽排序使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
javascript FAQ函數(shù)(提問+回復(fù))
javascript FAQ函數(shù)，當(dāng)點(diǎn)擊問題時(shí)顯示下面的回復(fù)內(nèi)容。2009-07-07
兼容主流瀏覽器的 iframe 自適應(yīng)高度，很實(shí)用的，具體的js腳本如下，感興趣的朋友可不要錯(cuò)過2014-01-01