首页
前端开发
Javascript
jQuery.i18n.properties多语言切换插件演示

jQuery.i18n.properties多语言切换插件演示

0 次浏览 0 条评论
zip
zip

语言切换的多语言插件里，jQuery.i18n.properties算是老牌选手了，配置简单、兼容性不错，挺适合老项目加多语言功能用的。

demo-jQuery.i18n.properties 的演示就挺直观的。就是下拉选个语言，页面文字就跟着变，响应也快，页面也不闪，体验还不错。

它用的是.properties文件来存翻译文本，比如key_en_US、key_zh_CN这种格式，文件放好之后，通过$.i18n().load()加载对应语言，批量更新带data-i18n的元素。

代码逻辑也清楚：监听语言选择框变化，调用插件 API，加载新语言的配置，再用$.i18n.prop()更新文字。比如：

$('#languageSelect').on('change', function() {
  var lang = $(this).val();
  $.i18n().load('i18n/' + lang + '.properties').done(function() {
    $('[data-i18n]').each(function() {
      var key = $(this).data('i18n');
      $(this).text($.i18n.prop(key));
    });
  });
});

插件还支持带参数的字符串，比如：error.username=Invalid username: {0}，配合$.i18n.prop('error.username', userName)就能动态填值。

如果你项目用的是 jQuery，又不想引入太多新东西，这套方案还蛮合适的，轻量、省事儿、能直接上手。

你也可以看看其他相关的i18next或者H5 i18n 实现，对比一下不同实现方式。

zip 文件大小：40.39KB