通过jquery 使用 i18n，实现多语言

jquery.i18n.properties.js 文件下载可查看
https://download.csdn.net/download/qq_37541486/12837911

结果预览

1.引入jquery
2.引入jquery.i18n.properties.js
3.创建common_zh.properties和common.properties文件
（ 如果使用 common.properties文件英文没反应，可以修改为common_en.properties）

##common_zh.properties
Contact = 联系我们
Contact1 = 注册问题，请查阅 <a>用户支持页面</a>.

##common.properties
Contact = Contact
Contact1 = For questions regarding user registration<br/> please see <a>our user page</a>.

html中的使用

1. data-i18n-text=“Contact” （普通标签的多语言写法）
2. data-i18n-placeholder=“Contact” ( 表单类的 placeholder的多语言写法)
3. data-i18n-text_call=“Contact1” (带标签的多语言写法)
4. data-i18n-value
5. data-i18n-title

js中的使用

1. $.i18n.prop(‘Contact1’)

代码示例

<!-- 通过 data-i18n-text="“为标签赋值 -->
<div id="timeType"><label class="itemLabel radio-inline"><input type="radio" name="Resolution" value="y"/> <span data-i18n-text="AnnualAvg"></span></label><label class="itemLabel radio-inline"><input type="radio" name="Resolution" value="m"/> <span data-i18n-text="MonthlyAvg"></span></label><label class="itemLabel radio-inline"><input type="radio" name="Resolution" value="d"/> <span data-i18n-text="DailyAvg"></span></label>
</div>
<!-- 通过 data-i18n-placeholder="“ 为placeholder赋值 -->
<input class="form-control input-xs" type="text" readonly name="range" id="SelectTime" data-i18n-placeholder="pleSeleTimePeriod"/>

this.language =$.cookie('pll_language');
this.pathUrl = ''
this.i18nModal();
i18nModal:function(){
    $.i18n.properties({
     // 加载资浏览器语言对应的资源文件name: 'common', // 资源文件名称path: this.pathUrl+'/public/i18n/', // 资源文件路径mode: 'both', // 用 Map 的方式使用资源文件中的值language:this.language,callback: function() {
     // 加载成功后设置显示内容try {
    //初始化页面元素$('[data-i18n-placeholder]').each(function () {
    $(this).attr('placeholder', $.i18n.prop($(this).data('i18n-placeholder')));});$('[data-i18n-text]').each(function () {
    //如果text里面还有html需要过滤掉var html = $(this).html();var reg = /<(.*)>/;if (reg.test(html)) {
    var htmlValue = reg.exec(html)[0];$(this).html(htmlValue + $.i18n.prop($(this).data('i18n-text')));}else {
    $(this).text($.i18n.prop($(this).data('i18n-text')));}});$('[data-i18n-text_call]').each(function () {
    //如果text里面还有html需要过滤掉$(this).html($.i18n.prop($(this).data('i18n-text_call')));});$('[data-i18n-value]').each(function () {
    $(this).val($.i18n.prop($(this).data('i18n-value')));});$('[data-i18n-title]').each(function () {
    $(this).attr('data-original-title',$.i18n.prop($(this).data('i18n-title')));});}catch(ex){
     }}});
}