i18n国际化的例子
这个可以点击菜单进行中英文切换,每次切换就可以改变sessionStorage.languge,进行改变i18n的参数lang的值,然后重新调用下就可以了。
工程结构:
i18n--|
|---css(这里是空的)
|--img(这里是空的)
|--js--|
|--i18n--|
|--messages_en_US.properties//国家化翻译文件
|--messages_en.properties//国家化翻译文件
|--messages_zh_CN.properties//国家化翻译文件
|--messages_zh.properties//国家化翻译文件
|--messages.properties//国家化翻译文件
|--jquery.i18n.properties.js//i18n插件
|--jquery-3.2.1.min.js
|--index.html
其中,index.html里边的代码是:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src='js/jquery-3.2.1.min.js' type="text/javascript"></script>
<script src='js/jquery.i18n.properties.js' type="text/javascript"></script>
</head>
<body>
<span data-i18n="common.test"></span>
<script>
function loadProperties(name,path,lang){
var lang=lang || navigator.languge//没有传人语言时候,就用浏览器缓存的
$.i18n.properties({
name:name,//这个是参数path指定路径的首个单词,也就是资源文件名
path:path,//指定国际化映射文件的路径
mode:'map',//指定以键值对的形式获取资源
languge:lang,//指定语言类型中英文,举个例子:"zh_CN"为中文
callback:function(){//加载完成后的回调函数
$('[data-i18n]').each(function(){//遍历所有属性是data-i18n
$(this).html($.i18n.prop($(this).data("i18n")));//把这个属性值传入翻译后放到页面上
})
$('[data-i18n]').each(function(){//遍历所有属性是data-i18n
$(this).attr('placeholder',$.i18n.prop($(this).data("i18n")));//翻译placeholder属性值
})
}
})
}
var i18n=function(key){
return $.i18n.prop(key);
}
$(document).ready(function(){
loadProperties('messages','js/i18n/','zh_CN');//调用国际化函数
console.log(i18n("common.test"));//也可以直接在js里边定义之后调用翻译
})
</script>
</body>
</html>
messages_zh.properties文件内容是:
common.test=\u5220\u9664\u4E91\u684C\u9762
i18n国际化的例子的更多相关文章
- Django1.9开发博客(12)- i18n国际化
国际化与本地化的目的为了能为各个不同的用户以他们最熟悉的语言和格式来显示网页. Django能完美支持文本翻译.日期时间和数字的格式化.时区. 另外,Django还有两点优势: 允许开发者和模板作者指 ...
- Bootstrap-datepicker3官方文档中文翻译---I18N/国际化(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
I18N/国际化 这个插件支持月份和星期名以及weekStart选项的国际化.默认是英语(“en”); 其他有效的译本语言在 js/locales/ 目录中, 只需在插件后包含您想要的地区. 想要添加 ...
- i18n(国际化) 和l18n(本地化)时的地域标识代码
i18n(国际化) 和l18n(本地化)时的地域标识代码 格式如 zh-CN(语言-国家) i18n(国际化) 和l18n(本地化)时的地域标识代码 格式如 zh-CN(语言-国家) 国家说明 语言说 ...
- i18n,国际化翻译,excel与js互转
背景 公司开发新产品时,要求适配多国语言,采用i18n国际化工具,但翻译字典(js的json)还是需要前端自己写的.字典最终需要转换成excel给专业人员翻译,翻译完成后再转换成js字典文件. 如果手 ...
- 【JavaWeb】i18n 国际化
i18n 国际化 什么是 i18n 国际化(Internationalization)指的是同一个网站可以支持多种不同的语言,以方便不同国家,不同语种的用户访问. 希望相同的一个网站,不同人访问的时候 ...
- vue 项目的I18n国际化之路
I18n (internationalization ) ---未完善 产品国际化是产品后期维护及推广中重要的一环,通过国际化操作使得产品能更好适应不同语言和地区的需求 国际化重点:1. 语言语言本地 ...
- I18N 国际化
http://blog.sina.com.cn/s/blog_6c7e59770101p7w9.html 一.I18N 在 J2EE 中的应用 [转载:http://blog.csdn.net/cha ...
- Web---JSTL(Java标准标签库)-Core核心标签库、I18N国际化、函数库
前面为JSTL中的常用EL函数,后面的为具体演示实例! JSTL简介: JSTL(Java Standard Tag Library) –Java标准标签库. SUN公司制定的一套标准标签库的规范. ...
- Struts2 学习笔记17 I18N国际化
讲解一下国际化的内容,比如书有些大的网站可以一键切换语言,例如中英切换,这时候就会用到国际化.但是由于struts2大多数是用来写后台,国际化并不是十分重要,而且用国际化开发会减慢开发的速度,大家只要 ...
随机推荐
- cce - 控制台中文环境
语法 (SYNTAX) cce [-e program] 描述 (DESCRIPTION) 该程序是一个类似于 WZCE , yact 和 chdrv 的控制台中文平台.进入该环境后可以用“空格 + ...
- 安装gitlab并配置邮箱
安装要求:运行内存必须大于等于2G 一.安装docker wget -qO- https://get.docker.com/ | sh 镜像加速: echo '{"registry-mirr ...
- web.xml的简单解释以及Hello1中web.xml的简单分析
一.web.xml的加载过程 ①当我们启动一个WEB项目容器时,容器包括(JBoss,Tomcat等).首先会去读取web.xml配置文件里的配置,当这一步骤没有出错并且完成之后,项目才能正常的被启动 ...
- vue之loader处理静态资源
webpack 是利用loader 来处理各种资源的,wepback的配置基本上就是为各种资源文件,指定不同类型的loader. 1,处理css 最基本的css 处理loader 是css-loade ...
- Perl语言入门:第六章习题:处理用户所指定的名字并汇报相应的姓。
37 print "\n----------------------------------_exercise_6_1--------------------------\n"; ...
- python 导入beautifulsoup报错
导入Beautifulsoup 报错 AttributeError: 'module' object has no attribute '_base' 解决方法: pip install --up ...
- MRC转ARC(2)
春节前抽空花了一天的时间将手头的工程从MRC转成了ARC,然后陆陆续续地修复一部分因为转ARC引起的内存泄漏和崩溃,到目前为止工程也算是比较稳定了,抽空记上一笔.(虽说这种事情这辈子估计都只会做这么一 ...
- Linux网络配置出现的问题
网络连接 : 选择桥接模式进入字符界面后,管理员登入后 ifconfig显示eth0和ol,但是不显示静态IP地址,即无inet.地址.广播.掩码 解决方案: 1.使用sudo dhclient e ...
- 后端传前端数据乱码(返回json字符串到前端)
中文乱码的问题,在开发过程中难免会遇到,而在配置好编码之后,不管是数据库,还是其他地方都配置好统一UTF-8编码之后,后端从数据库取出数据传回前端,还会乱码,这里以ssm框架为例,因为是我自己遇到的, ...
- Python之使用eval()函数将字符串的数据结构提取出来
data = input('请输入你要修改的对象:').strip() ''' 输入下面的字典列表 [{'backend':'www.oldboy1.org','record':{'server':' ...