如何根据浏览器语言选择文件?

时间:2012-04-13 03:49:31

标签: localization sencha-touch sencha-touch-2

如何根据sencha touch 2中的浏览器语言选择文件?我的项目下有3个文件app_de.js,app_en-US.js和app_es.js。 我找到了浏览器语言并加载了这样的文件:

 <script type="text/javascript" id="extlocale">

    var browserLang = window.navigator.language; // get the browsers language
    alert(browserLang);
    var locale = 'en'; // default locale

    if(browserLang == 'de' || browserLang == 'de-de')       //called when the language is german
    {
        locale = 'de';
    }
    else if(browserLang == 'en-US' || browserLang == 'en-us' || browserLang == 'en')
    {
        locale = 'en-US';                           //called when the language is english
    }
    else if(browserLang == 'es' || browserLang == 'es-es' )
    {
        locale = 'es';                              //called when the language is spanish
    }
    else
    {
        console.log("Invalid language");
        locale = 'en-US';
    }
    if(locale) {

       Ext.fly('extlocale').set({src:'app_'+locale+'.js'});

    }

</script>

如果我以这种方式包含文件,文件将单独工作:

  <script type="text/javascript" src="app_en-US.js"></script>

请根据浏览器的语言告诉我如何加载文件?

2 个答案:

答案 0 :(得分:1)

要根据Sencha Touch 2中的浏览器语言加载文件,最好的办法是加载公共文件,并根据浏览器语言加载内容。

<script type="text/javascript" src="locale.js"></script><!--locale.js was the file invoked-->

locale.js中,根据浏览器的语言,加载内容。

登录表单示例:

var browserLang = window.navigator.language; // get the browsers language
alert(browserLang);

var Messages;

switch (browserLang) {

    case 'en-US':
    Messages = {
        username : 'EN-glish Username',
        password : 'EN-glish Password',
        login    : 'EN-glish Login' 
    };
    break;

    case 'hi':
    Messages = {
        username : 'HI-ndi Username',
        password : 'HI-ndi Password',
        login    : 'HI-ndi Login'   
    };
    break;

    ........

}

由此,如果浏览器语言为en-US,则显示英语内容,如果语言为印地语,则显示印地语内容。

我在这里使用了一个简单的开关盒,但根据您的使用情况,修改它以达到您的目的。

答案 1 :(得分:0)

您需要一种更加跨浏览器的方式来检测浏览器语言。它没有标准,但以下是一个很好的尝试:

 function browserLanguage() {
   if (!navigator) { return null; }
   return navigator.language || navigator.browserLanguage ||
          navigator.systemLanguage || navigator.userLanguage || null; 
 }  

您还需要一种更好的方法来将语言代码映射到您支持的语言代码。例如,不应该将de-AT识别并视为de?恩GB怎么样?最简单的方法是解析语言代码,以便执行split('-')并仅执行第一部分。如果您的文件需要为en-US.js,则需要将en映射到en-US。

我不知道Ext.fly(),但只是添加script元素相当容易,即使没有库也是如此。只需在文档中找到它的位置,执行document.createElement('script'),为其指定src属性,然后将其放入文档树中。

请注意,浏览器语言是浏览器自己对自己的UI语言的想法,根本不需要匹配用户的首选项。用户通常无法控制,除非他可以决定使用哪种浏览器(及其版本)。