使用 JQuery Globalization 函数库开发全球化网页应用程序（1）
|
- UID
- 1066743
|
使用 JQuery Globalization 函数库开发全球化网页应用程序（1）
在全球化的经济发展趋势下，软件对全球化的支持这个议题，在企业应用程序的开发流程中越来越被重视。对于面向全球用户的应用程序开发，全球化的支持更是成功的一个关键部分。
全球化支持主要可以分为两个部分，其一是设计一个能够提供给用户最适用的语言环境的机制。这个需求应当在基础架构设计时便加以考虑。当用户偏好语言翻译不存在时，亦应提供一个最适合语言的回退机制。比如说: 一个惯用法文的使用者，碰到法文语言翻译资源不存在时，应该依照预先设定的语言偏好顺序提供适用的语言翻译，或者提供企业默认语言的接口取代。其二则是对各种数据，提供本地化的格式呈现，就像每个国家的人说的语言不同，各国所习惯的数字、日期与货币等格式也大相径庭。
本文将介绍如何利用 JQuery 里的 Globalize 1.0 函数库进行全球化应用程序的开发。jQuery 是一套跨浏览器的 JavaScript 函数库，它是目前业界最受欢迎的 JavaScript 函数库。从 2015 年开始，它进一步提供了全球化的支持，开发者可依靠不同函数的呼叫，将能使得所开发的应用程序具有多语言支持，包括日期、数字、货币数据类别的转换与复数语法的呈现。
在下文中，我们将使用几个案例先解说如何设置并开始使用 JQuery Globalization 函数库，然后介绍如何用 JQuery Globalization 实现翻译本地化，以及日期、相对时间、数字、复数、货币型态的格式化。
JQuery Globalize1.0 的沿革对于 JQuery 全球化的需求并不是一个新的议题，早在 2010 年 JQuery 便纳入一套由 Microsoft®发布的 jQuery 插件。而且在 2015 年的四月，JQuery 更推出一套官方的 Globalize 函数库取而代之。新的函数库的强项是它基于 Unicode 标准下使用 Common Locale Data Repository(CLDR)的数据，因此他的数据格式永远是最新，当下最准确的。
引用 CLDR 的内容的好处全球化的函数库需要 CLDR 的内容才能正确的运行。函数库本身不包含任何格式的内容，相反，它提供加载格式数据的能力。这样的实现方式提供了几个优点：
- 避免数据格式过时造成的错误。
开发人员可以随时取得最新的格式资料，不用等待格式数据被更新到 JQuery 函数库的时间。 - 开发人员具有更完整的控制权。
CLDR 数据可依照应用程序的需求，加载所需求的部分，避免造成资源的浪费。 - 资源共享。
CLDR 数据可以被 Globalize 以及其它用到 CLDR 资料的函数库共享。
简而言之，使用 JQuery Globalization 函数库除了加载函数库本身，另外需要按照应用程序本身的需求加载 CLDR 数据，下面将详细描述使用的步骤。
如何开始使用 JQuery Globalization 函数库第一步：下载 CLDR 资料取得 CLDR 有多种方式，除了到 Unicode 网站下载最新版本( )，也可透过套件管理程序下载，比如安装 node.js 后在命令行输入以下命令。
第二步：载入 js 函数库要使用 JQuery globalize API， 至少需要加载"jquery.js"， "cldr.js"， "cldr/event.js"， "cldr/supplemental.js"， "globalize.js" 五个 javascript 模块，必须依照顺序加载。
第三步：将 CLDR 数据加载到 Globalize 函数库JQuery globalize API 本身不包含任何 CLDR 数据内容，各对应功能以及语系所需要用到的 CLDR 数据需另外加载。需要注意的是：
"/cldr/supplemental/likelySubtags.json" 对 jquery globalize API 是一个必备的模块。
综上所述, Globalization 模块的加载方式可以参照下面的这段示范代码（清单 1）：加载必要的 jquery.js 文件后, 需要加载 CLDR 数据的 json 文件，这部分分为跨不同格式，需要与格式依存的数据。
清单 1.加载 CLDR 文件示例1
2
3
4
5
6
7
8
9
10
11
12
13
| <script src="jquery.js"></script>
<script>
$.when(
$.get( "/cldr/main/en/ca-gregorian.json"),
$.get( "/cldr/supplemental/likelySubtags.json" ),
$.get( "/cldr/supplemental/timeData.json" ),
).then(function() {
return [].slice.apply(arguments,[0].map(function(result){
return result[0];
});
}).then(Globalize.load).then(function(){
});
</script>
|
|
|
|
|
|
|
