jQuery.i18n.properties是一款轻量级的jQuery国际化插件,能实现Web前端的国际化。

国际化英文单词为:Internationalization,又称i18n,“i”为单词的第一个字母,“18”为“i”和“n”之间单词的个数,而“n”代表这个单词的最后一个字母。jQuery.i18n.properties采用.properties文件对JavaScript进行国际化。jQuery.i18n.properties插件首先加载默认的资源文件(strings.properties),然后加载针对特定语言环境的资源文件(strings_zh.properties),这就保证了在未提供某种语言的翻译时,默认值始终有效。

资源文件命名有以下三种格式:

basename.properties

basename_language.properties

basname_language_country.properties

jQuery.i18n.properties API

jQuery.i18n.properties的API只有几个:jQuery.i18n.properties()、jQuery.i18n.prop()、jQuery.i18n.browserLang(),当然也可以采用.i18n.properties()、.i18n.properties()、.i18n.prop()、$.i18n.browserLang()的形式使用这些API。

jQuery.i18n.properties(settings)

该方法加载资源文件,其中settings是配置加载选项的一系列键值对。各项配置项的具体描述如下:

选项 描述 类型 可选
name 资源文件的名称,例如strings或[strings1,strings2],前者代表一个资源文件,后者代表资源文件数组 string或string[]   否
path 资源文件所在路径 string
mode

加载模式:

“vars”表示以JavaScript变量或函数的形式使用资源文件中的Key

“map”表示以Map的方式使用资源文件中的Key

“both”表示以同时使用两种方式。如果资源文件中的Key包含JavaScript关键字,则只能采用“map”。默认值是“vars”。

string
language

ISO-639指定的语言编码(例如“en”表示英文,“zh”表示中文),或者同时使用ISO-639和ISO-3166编码(例如:“en_US”,“zh_CN”)。如果不指定,则采用浏览器报告的语言编码。

string
cache

指定浏览器是否对资源文件进行缓存,默认值为false

boolean
encoding

加载资源文件时使用的编码。默认值为UTF-8

string
callback

代码执行完成时运行的回调函数

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

jQuery.i18n.prop(key)

该方法以map方式使用资源文件中的值,其中key指的是资源文件中的key。当key指定的值含有占位符时,可用使用jQuery.i18n.prop(key,val1,val2……)的形式,其中val1,val2……对点位符进行顺序替换。

jQuery.i18n.browserLang()

用于获取浏览器的语言信息。

使用的方式

项目组织结构

在i18n目录下,strings.properties对应默认翻译,strings_zh.properties对应中文翻译。

strings.properties

strings_zh.properties

<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/js/jquery.i18n.properties-1.0.9.js"></script>
 <div id="content">
<div>
<label id="label_username"></label>
<input type="text" id="username"></input>
</div>
<div>
<label id="label_password"></label>
<input type="password" id="password"></input>
</div>
<input type="button" id="button_login"/>
</div>
<script type="text/javascript">
$(function(){
jQuery.i18n.properties({
name : 'strings', //资源文件名称
path : '/i18n/', //资源文件路径
mode : 'map', //用Map的方式使用资源文件中的值
language : 'zh',
callback : function() {//加载成功后设置显示内容
$('#button-login').html($.i18n.prop('Login'));
$('#label-username').html($.i18n.prop('User Name'));
$('#label-password').html($.i18n.prop('Password'));
}
});
});
</script>

下载地址:

https://code.google.com/p/jquery-i18n-properties/downloads/list

http://www.it165.net/pro/html/201502/33640.html

jQuery之前端国际化jQuery.i18n.properties的更多相关文章

  1. 【转】jQuery之前端国际化jQuery.i18n.properties

    jQuery之前端国际化jQuery.i18n.properties 基于jQuery.i18n.properties 实现前端页面的资源国际化 jquery-i18n-properties

  2. jQuery之前端国际化jQuery.i18n.properties[转]

    http://www.ibm.com/developerworks/cn/web/1305_hezj_jqueryi18n/ jQuery.i18n.properties是一款轻量级的jQuery国际 ...

  3. 使用 jQuery.i18n.properties 实现 Web 前端的国际化

    jQuery.i18n.properties 简介 在介绍 jQuery.i18n.properties 之前,我们先来看一下什么是国际化.国际化英文单词为:Internationalization, ...

  4. jquery.i18n.properties前端国际化解决方案“填坑日记”

    但现在的情况是老的项目并没有使用这类架构.说起国际化,博主几年前就做过,在MVC里面实现国际化有通用的解决方案,主要就是通过资源文件的方式定义多语言.最初接到这个任务,并没有太多顾虑,毕竟这种东西有很 ...

  5. 前端系列——jquery.i18n.properties前端国际化解决方案“填坑日记”

    前言:最近,新的平台还没有开发完成,原来的老项目又提出了新的需求:系统国际化.如果是前后端完全分离的开发模式,要做国际化,真的太简单了,有现成的解决方案,基于Node构建的时下热门的任何一种技术选型都 ...

  6. Web前端国际化之jQuery.i18n.properties

    Web前端国际化之jQuery.i18n.properties jQuery.i18n.properties介绍 国际化是如今Web应用程序开发过程中的重要一环,jQuery.i18n.propert ...

  7. jquery.i18n.properties前端国际化方案

    如果新项目要做系统国际化, 时下热门的任何一种技术选型都有成熟的方案,比如: vue + vue-i18n angular + angular-translate react + react-intl ...

  8. jQuery国际化插件 jQuery.i18n.properties 【轻量级】

    jQuery.i18n.properties是一款轻量级的jQuery国际化插件,能实现Web前端的国际化. 国际化英文单词为:Internationalization,又称i18n,“i”为单词的第 ...

  9. 基于jQuery.i18n.properties实现前端网站语言多版本

    我是参考播客做了个demo:http://blog.csdn.net/aixiaoyang168/article/details/49336709 jQuery.i18n.properties采用.p ...

随机推荐

  1. 【转】PL/SQL Developer使用技巧、快捷键

    原文链接:PL/SQL Developer使用技巧.快捷键 1.类SQL PLUS窗口:File->New->Command Window,这个类似于oracle的客户端工具sql plu ...

  2. SVG绘制矩形简单示例分享

    最近我初学HTML5,刚在一步步学习SVG,积累了一些个人心得和程序代码,希望和大家分享,今天分享“svg之矩形”部分 1.简单矩形 效果图如下: 关键代码: <svg xmlns=" ...

  3. emment语法

    emment插件语法.md 元素 div → <div></div>foo → <foo></foo> 嵌套运算符 子: > div>ul& ...

  4. (转载)与OpenDialog相关的一个问题

    OpenDialog的一个问题 有一个功能要求就是[每次打开文件的对话框的默认路径是上一次保存文件的路径],本来这个就是设置OpenDialog控件的InitialDir属性就行了,但是第一次打开的时 ...

  5. scrapy使用爬取多个页面

    scrapy是个好玩的爬虫框架,基本用法就是:输入起始的一堆url,让爬虫去get这些网页,然后parse页面,获取自己喜欢的东西.. 用上去有django的感觉,有settings,有field.还 ...

  6. 三菱plc编程电缆通讯端口设置方法(转载)

    三菱plc编程电缆通讯端口如何设置?三菱plc编程电缆通讯端口设置方法 时间:2015-10-21 05:09:20编辑:电工栏目:三菱plc 导读:三菱plc编程电缆通讯端口的设置方法,三菱plc上 ...

  7. Web应用的组件化(二)

    管控平台 在上一篇中我们提到了组件化的大致思路,这一篇主要讲述在这么做之后,我们需要哪些外围手段去管控整个开发过程.从各种角度看,面对较大规模前端开发团队,都有必要建立这么一个开发阶段的协作平台. 在 ...

  8. bzoj 1195: [HNOI2006]最短母串 爆搜

    1195: [HNOI2006]最短母串 Time Limit: 10 Sec  Memory Limit: 32 MBSubmit: 894  Solved: 288[Submit][Status] ...

  9. IAR Embedded Workbench 破解方法+工具+授权文件

    转自IAR Embedded Workbench 破解方法+工具+授权文件 本文重点阐述了如何手动爆破 IAR EWARM 6.x以及生成License,目的一是和大家分享下,二是自己记录下过程,以便 ...

  10. JMS的作用

    JMS就是生产者与消费者模式.消费者负责消费生产者产生的消息.通过JMS可以做后台的异步操作,应用到具体工作中的话,有用它来发内部消息的.发邮件的.发短信的,做大操作时在后台做异步操作的. Java ...