jquery 國際化使用

jquery 有專門使用 國際化的插件 ,jquery.i18n.properties

jQuery.i18n.properties 採用 .properties 文件對 JavaScript 進行國際化。jQuery.i18n.properties 插件根據用戶指定的（或瀏覽器提供的 ）語言和國家編碼（符合 ISO-639 和 ISO-3166 標準）來解析對應的以“.properties”爲後綴的資源文件。

jQuery.i18n.properties 插件首先加載默認的資源文件（例如：strings.properties），然後加載針對特定語言環境的資源文件（例如：strings_zh.properties），這就保證了在未提供某種語言的翻譯時，默認值始終有效。開發人員可以以 JavaScript 變量（或函數）或 Map 的方式使用資源文件中的 key。

使用國際化:

第一步：創建properties資源文件。

例如創建如下文件名 ：爲 strings.properties，那麼與之對應的必須要有 strings_zh.properties，兩個文件名的key 值必須保持一致

第二步：在js文件中引入jQuery.i18n.properties所需js文件。

<script src="<>/js/jquery.i18n.properties-min-1.0.9.js"></script>

**

第三步：使用jQuery.i18n.properties 的API

**

<script type="text/javascript">
               $(document).ready(function(){
               //國際化加載屬性文件
                       jQuery.i18n.properties({
                           name:'js',
                           path:'<%=path%>/js/i18n/',
                           mode:'map',
                           callback: function() {// 加載成功後設置顯示內容
                               //alert(jQuery.i18n.prop("theme_manage.js_activity"));
                           }
                       });
        });
</script>

參數介紹:

name : 定義的資源文件中語言簡碼前面的字符串，可以是一個數組，如果資源文件 有 visualization_strings.properties，visualization_strings_zh.properties,strings.properties,則

name:['strings','visualization_strings'], //資源文件名稱

path: 資源文件的相對路徑,相對於整個工程來說，例如如下:

    path:'i18n/', //資源文件路徑

mode: 加載模式；”vars”表示以JavaScript變量或函數的形式加載資源文件中的key值（默認爲這種），“map”表示以map的方式加載資源文件中的key值。“both表示可以同時使用這兩種方式”。

callback：回調函數

第四步：js文件中根據key找對應的值。

function getMod3Ratio(time) {
    var title = $.i18n.prop('com_zte_lte_PCI_ui_main_PCIMod3ErrorThrown');
    $.ajax({
        type: "GET",
        contentType: "application/json",
        url: "lte/pci/mod3rate",
        async: false,
        data: {
            "province": geo.province,
            "city": geo.city,
            "district": geo.district,
            "timeUnit": curTimeUnit,
            "time": time
        },
        success: function(data) {
            mod3Ratio = data;
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            reqFailedProcessForPNotify(XMLHttpRequest, textStatus, errorThrown, title)
            console.log(errorThrown);
        }
    });
    return;
}

$.i18n.prop('com_zte_lte_PCI_ui_main_PCIMod3ErrorThrown');對應着資源文件中的key值

jQuery.i18n.properties實現的原理

根據name後面的值，加上瀏覽器的語言簡碼，再加上.properties找到對應的資源文件。這個過程是自動的，只需要進行上面的配置即可。
propertites中鍵值對如下：等號前的爲key，等號後的爲值（注意一點的是，不同的資源文件中key必須保持一致，是自定義的）。
例如: visualization_strings_zh.properties

#小區總數二級頁面表單
#com_zte_lte_projectparametermanage_cellsum_checkform_city=城市



com_zte_lte_projectparametermanage_table_loading=加載中...

#表格

#表格翻頁
com_zte_lte_visualization_table_first_page=首頁
com_zte_lte_visualization_table_pre_page=前一頁
com_zte_lte_visualization_table_next_page=後一頁
com_zte_lte_visualization_table_last_page=尾頁
com_zte_lte_visualization_table_data_nothing=沒有找到相應的數據
#導出
com_zte_lte_visualization_cellsum_homepage_export=導出

而對應的 visualization_strings.properties 文件的key 值應該保持一致

#RSRP
#com_zte_lte_visualization_cellsum_checkform_city=City

#CallDropAnalysis

#OverShootCoverage

#WeakCoverage

#OverlapCoverage

#表格翻頁
com_zte_lte_visualization_table_first_page=First
com_zte_lte_visualization_table_pre_page=Previous
com_zte_lte_visualization_table_next_page=Next
com_zte_lte_visualization_table_last_page=Last
com_zte_lte_visualization_table_data_nothing=No data available in table
com_zte_lte_projectparametermanage_table_loading=loading
#導出
com_zte_lte_visualization_cellsum_homepage_export=Export

附上獲取瀏覽器的語言 代碼

 function getLanguage()
    {
        if (navigator.appName == 'Netscape')
        var language = navigator.language;
        else
        var language = navigator.browserLanguage;
        if (language.indexOf('en') > -1) document.write('english');
        else if (language.indexOf('nl') > -1) document.write('dutch');
        else if (language.indexOf('fr') > -1) document.write('french');
        else if (language.indexOf('de') > -1) document.write('german');
        else if (language.indexOf('ja') > -1) document.write('japanese');
        else if (language.indexOf('it') > -1) document.write('italian');
        else if (language.indexOf('pt') > -1) document.write('portuguese');
        else if (language.indexOf('es') > -1) document.write('Spanish');
        else if (language.indexOf('sv') > -1) document.write('swedish');
        else if (language.indexOf('zh') > -1) document.write('chinese');
        else
        document.location.href = 'english';
    }

以上就是jquery 國際化基本使用方法

**

js 中使用舉例

**

$('#comparing button span:first-child').html($.i18n.prop('com_zte_lte_visualization_Geography'));


            $('#Cell_popup_export input').val($.i18n.prop('com_zte_lte_visualization_cellsum_homepage_export'));