如何根据浏览器语言选择文件？答案

【问题标题】：How to select the file depending on the browser language?如何根据浏览器语言选择文件？
【发布时间】：2012-04-13 03:49:30
【问题描述】：

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>

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

【问题讨论】：

你可以在服务器上做任何事情，还是你被 JavaScript 卡住了？

标签： localization sencha-touch sencha-touch-2

【解决方案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，则显示英文内容，如果语言为印地语，则显示印地语内容。

这里我使用了一个简单的开关盒，但根据您的可用性，对其进行修改以满足您的目标。

【讨论】：

【解决方案2】：

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

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

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

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

请注意，浏览器语言是浏览器自己对自己的 UI 语言的想法，根本不需要匹配用户的偏好。它通常甚至无法由用户控制，除非他可以决定他使用哪个浏览器（及其版本）。

【讨论】：