web项目实现国际化

web网站实现国际化：

思路

1.引入js文件
2.添加(.properties)资源文件
3.编写js方法

1.须要的js文件：

[jquery.i18n.properties-1.0.9.js][1]
jquery.js

2.资源文件:以.properties文件的key-value的特性，设置key和value，通常一个语种要写一个文件。

例如： zh.properties文件这样写：publicName=姓名
       en.properties文件这样写：publicName=name

3.js方法：在js方法中加载资源文件，根据key获得value值，而后经过选择器在给元素赋值，显示在页面上。

例如：加载zh.properties文件时，能够根据publicName获得”姓名“
      加载en.properties文件时，能够根据publicName获得“name”

实践

第一步：

<script type="text/javascript" src="${js}/jquery.i18n.properties-1.0.9.js"></script>
<script type="text/javascript" src="${js}/jquery-3.2.1.min.js"></script>

第二步：

个人这里作的是中文简体和繁体的转化：
因此简体的文件名是messahes_CN_dl.properties,意思是中国大陆

内容以下：startReader = 开始阅读

繁体字的文件名是message_CN_tw.properties,意思是中国台湾

内容以下：startReader = 開始閱讀

第三步：

function loadProperties() {
    jQuery.i18n.properties({//加载资浏览器语言对应的资源文件
        name : 'messages_CN_dl', //资源文件名称
        path : '${messages}/', //资源文件路径
        mode : 'map', //用Map的方式使用资源文件中的值
        callback : function() {//加载成功后设置显示内容
            $('.btn_start').html($.i18n.prop('startReader'));
        }
    });
}

此方法的name的值是加载的资源文件名，

若是加载message_CN_tw.properties文件。
那么    $.i18n.prop('startReader')的值就是“開始閱讀”，
若是加载messahes_CN_dl.properties
那么    $.i18n.prop('startReader')的值就是“开始阅读”，

因此这个name的值也能够用做该方法的参数，根据不一样的参数得出不一样的字体（或语种）。

结果：

能够看到中间开始阅读的按钮字体的变化