i18n = internationalization, 这个单词 i 开头, n 结尾,中间18个字母,所以简称 i18n。
jquery.i18n,是一个基于jquery的在网页上实现多语言支持的js框架。Repo: https://gitee.com/mirrors/jquery.i18n
这个框架本质上就是自动读取json文件,然后用json文件中的文本渲染页面。
使用很简单,有如下几步:
1. 引用jquery和jquery.i18n的js文件
<script src="../jquery.min.js"></script>
<script src="../jquery.i18n.min.js"></script>
2. 对显示文字的标签,加上一个 i18n 的属性:
<div i18n="footer.about">About</div>
3. 在html中加入如下这段html代码:
<script>$(document).ready(function() {/*默认语言*/var defaultLang = "en";$("[i18n]").i18n({defaultLang: defaultLang,filePath: "i18n/",filePrefix: "i18n_",fileSuffix: "",forever: true,callback: function() {console.log("i18n is ready.");}});/*切换为中文 - 按钮*/$(".chinese").click(function() {$("[i18n]").i18n({defaultLang: "cn",filePath: "i18n/"});});/*切换为英文 - 按钮*/$(".english").click(function() {$("[i18n]").i18n({defaultLang: "en",filePath: "i18n/"});});});
</script>
这段代码就是在告诉框架,存放不同语言的json文件的路径(filePath: "i18n/")和文件名的前缀(filePrefix: "i18n_"),比如中文就是 i18n/i18n_cn.json