PhoneGap实现Localization的一个例子


原文地址:http://www.pwhack.me/archives/phonegap-localization.html

这次参加“iOS7 Tech Talk”,了解了Localization和”Think Globally”的重要性。决定在目前已上线到app store的PhoneGap app(暂不发在博客)中增加英文的支持。查了下PhoneGap的文档发现并没有Localization的插件,于是在github上搜索了一下,找到了一个不错的localization插件但是并不支持3.0。还有一个原生js实现的l10n,但是其中用到的特性不被webview和UIWebView中的浏览器支持。

想想其实实现Localization并不难,于是就自己实现了一个。希望能抛砖引玉,给大家提供一个思路:在app初始化的时候替换文字内容就ok了。

Requirements:

Globalization插件

phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-globalization.git

jQuery

虽然不用jQuery也能实现,但我还是比较懒的= =

localization.js

var localization = {};
localization.strings  = {};
localization.initialize = function () {
    console.log('initializing l10n.');
    //这是默认显示英文,支持中文的方式,请根据实际需求自行修改,比如用switch
    if (this.locale == 'zh_CN') {
        for (var property in localization.strings) {
            $('.str_' + property).html(localization.strings[property].zh_CN);
        }
    } else {
        for (var property in localization.strings) {
            $('.str_' + property).html(localization.strings[property].en_US);
        }
    }
};

// just two examples
localization.strings.hello = {
    zh_CN: '你好',
    en_US: 'hello'
};

localization.strings.name = {
    zh_CN: '小菜逼',
    en_US: 'Little Noob'
};

HTML

<span class="str_hello"></span>, I'm <span class="str_name"></span>.

Usage

deviceready的时候调用:

navigator.globalization.getLocaleName(function (locale) {
    localization.locale = locale.value;
    localization.initialize();
}, function () {
    console.log('an error occurred while getting locale name');
});

发表评论

电子邮件地址不会被公开。 必填项已用*标注

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>