当前位置: 代码迷 >> 综合 >> i18n 和 基于js的网页多语言框架 jquery.i18n的介绍
  详细解决方案

i18n 和 基于js的网页多语言框架 jquery.i18n的介绍

热度:96   发布时间:2023-12-09 22:27:37.0

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

  相关解决方案