html 语言国际化,js使用i18n实现页面国际化的方法
页面引用的插件
以下是页面引用的js
/**
* 设置语言类型: 默认为中文
*/
var i18nLanguage = "zh-CN";
/*
设置一下网站支持的语言种类
zh-CN(中文简体)、en(英语)
*/
var webLanguage = ['zh-CN', 'en'];
//获取网站语言
function getWebLanguage(){
//1.cookie是否存在
if (jQuery.cookie("userLanguage")) {
i18nLanguage = jQuery.cookie("userLanguage");
console.log("language cookie is "+i18nLanguage);
} else {
//2.1 获取用户设置的浏览器语言
var navLanguage = getNavLanguage();
console.log("user set browser language is "+navLanguage);
if (navLanguage) {
// 判断是否在网站支持语言数组里
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);
};
/**
* 执行页面i18n方法
* @return
* @author LH
*/
var execI18n = function(){
//获取网站语言(i18nLanguage,默认为中文简体)
getWebLanguage();
//国际化页面
jQuery.i18n.properties({
name : "common", //资源文件名称
path : $.contextPath+"/i18n/"+i18nLanguage+"/", //资源文件路径
mode : 'map', //用Map的方式使用资源文件中的值
language : i18nLanguage,
cache:false, //指定浏览器是否对资源文件进行缓存,默认false
encoding: 'UTF-8', //加载资源文件时使用的编码。默认为 UTF-8。
callback : function() {//加载成功后设置显示内容
//以下是将要国际化的文字内容
//退出
$("#logOut").html($.i18n.prop('logOut'));
//用户
$("#loginUser").html($.i18n.prop('loginUser'))
}
});
}
/*页面执行加载执行*/
$(function(){
/*执行I18n翻译*/
execI18n();
console.log("网站语言: "+i18nLanguage);
//国际化easyui
changeEasyuiLanguage(i18nLanguage);
});
国际化的文件存放路径,zh-CN表示简体中文;en表示英语;也可扩展其它语言,只要在i18n文件夹下添加对应的文件;key要一一对应,value则是文字的语言内容
中文的common.properties文件内容
login.userName=Username
login.passWord=Password
login.sub=Login
login.reset=Reset
login.anonymous=Anonymous
英文的common.properties文件内容
login.userName=Username
login.passWord=Password
login.sub=Login
login.reset=Reset
login.anonymous=Anonymous
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
html 语言国际化,js使用i18n实现页面国际化的方法相关推荐
- html页面国际化之谷歌翻译js实践,支持通过判断浏览器语言自动将中文翻译成英文
实践过程 最近boss提出了一个需求,需要支持打开的页面自动翻译成英文,csdn来回找资料,最终确定使用谷歌翻译js插件,这个插件测试只支持手动翻译,没能满足打开页面通过判断浏览器语言自动翻译成英文的 ...
- springboot13 页面国际化(i18n)
员工管理系统 1.首页配置:注意点,所有也免得静态资源都需要使用thymeleaf接管: 2.页面国际化 配置i18n文件 如果需要在项目中进行按钮自动切换,我们需要自定义一个组件LocaleReso ...
- HTML静态页面国际化,如何优雅的实现前端国际化
今天小编会使用boostrap框架搭建一个配有中英文切换功能的网页,还有就是使用nodejs搭建后台服务,从头实现一个完整的前端国际化开发项目,内容不算很复杂,很适合前端已入门的胖友们. 01 .前端 ...
- JS魔法堂:不完全国际化本地化手册 之 拓展篇
前言 最近加入到新项目组负责前端技术预研和选型,其中涉及到一个熟悉又陌生的需求--国际化&本地化.熟悉的是之前的项目也玩过,陌生的是之前的实现仅仅停留在"有"的阶段而已. ...
- Spring Boot 页面国际化
internationalization详解 国际化(internationalization)是设计和制造容易适应不同区域要求的产品的一种方式.它要求从产品中抽离所有地域语言,国家/地区和文化相关的 ...
- java i18n_Java i18n – Java的国际化
java i18n Internationalization in Java or Java i18n is a very important feature. Java provides inter ...
- vue 或 js 使用谷歌翻译实现国际化
问题 一般没有适配国际化的页面 我们会使用谷歌翻译插件进行翻译. 但由于使用浏览器中的谷歌翻译插件 会导致dom的结构发生改变,从而导致 vue react与dom操作绑定关系失效!这样就无法触发跳转 ...
- paip.最好的脚本语言node js 环境搭建连接mysql
paip.最好的脚本语言node js 环境搭建连接mysql #====下载node...走十一个exe..容易的.. 1 #0----Hello world .js 2 #---------模 ...
- 鸿蒙开发-在JS中获取hml页面中Input输入的值
场景 鸿蒙基于JS搭建HelloWorld并修改国际化文件: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/118274050 在 ...
最新文章
- 30年间,软件开发行业为何Bug纷飞?
- 替换ExpandableListView右边箭头Group Indicator(小图标)
- android Collections.addAll()的使用
- Software optimization resources
- 谈谈我对MYSQL乱码的解决办法
- access求斐波拉契数列_打印目录,斐波那契数列的递归与循环,牧场牛数
- 如何学习3D建模的学习之路,学习这些成为高手吧
- MIPI接口和DVP接口的区别及优点
- Image Tampering Detection via Semantic Segmentation Network
- win10系统IIS服务器配置详细教程,win10系统配置iis的操作方法
- (转)牛牛牌型判定(五小牛 五花牛 炸弹 银牛 牛牛 有牛没牛)
- 停车场管理系统可行性研究报告
- 手把手教你用深度学习做物体检测(四):模型使用
- 【ML特征工程】第 7 章 :通过K-Means 模型堆叠进行非线性特征化
- JDK1.8 关于list集合Lambda的使用
- 国家开放大学计算机基础应用型题一,国家开放大学(电大)《计算机应用基础》上机网考常考操作题及步骤...
- PCIE学习笔记(二)PCIe总线的拓扑结构,协议层,数据传输流程
- python统计水仙花数个数_Python一句代码实现找出所有水仙花数的方法
- python怎么自动化录入数据_Python自动化办公之–读取Excel 录入表单
- Stata:外部命令的搜索、安装与使用
热门文章
- 啦啦外卖独立版41.7完美运营版!全功能插件
- 2022亚太数学杯数学建模竞赛C题(思路、程序......)
- 信息系统安全个人笔记(xju)
- 南通python培训机构
- 国内安全设备厂家排名
- 互联网行业应届待遇十一档2014
- C/C++趣味程序设计百例(11~20)
- SpringBoot 1.X 优雅停机 ( shutdown gracefully )
- Notion 笔记Mac及windows客户端汉化
- 国内做数据可视化大屏哪家强?这5款产品你必须了解