zoukankan      html  css  js  c++  java
  • i18n国际化的例子

    这个可以点击菜单进行中英文切换,每次切换就可以改变sessionStorage.languge,进行改变i18n的参数lang的值,然后重新调用下就可以了。

    工程结构:

    i18n--|

             |---css(这里是空的)

             |--img(这里是空的)

             |--js--|

                     |--i18n--|

                                  |--messages_en_US.properties//国家化翻译文件

                                  |--messages_en.properties//国家化翻译文件

                                  |--messages_zh_CN.properties//国家化翻译文件

                                  |--messages_zh.properties//国家化翻译文件

                                  |--messages.properties//国家化翻译文件

                    |--jquery.i18n.properties.js//i18n插件

                    |--jquery-3.2.1.min.js

            |--index.html

    其中,index.html里边的代码是:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title></title>
    <script src='js/jquery-3.2.1.min.js' type="text/javascript"></script>
    <script src='js/jquery.i18n.properties.js' type="text/javascript"></script>

    </head>
    <body>
    <span data-i18n="common.test"></span>
    <script>
    function loadProperties(name,path,lang){
    var lang=lang || navigator.languge//没有传人语言时候,就用浏览器缓存的
    $.i18n.properties({
    name:name,//这个是参数path指定路径的首个单词,也就是资源文件名
    path:path,//指定国际化映射文件的路径
    mode:'map',//指定以键值对的形式获取资源
    languge:lang,//指定语言类型中英文,举个例子:"zh_CN"为中文
    callback:function(){//加载完成后的回调函数
    $('[data-i18n]').each(function(){//遍历所有属性是data-i18n
    $(this).html($.i18n.prop($(this).data("i18n")));//把这个属性值传入翻译后放到页面上

    })
    $('[data-i18n]').each(function(){//遍历所有属性是data-i18n
    $(this).attr('placeholder',$.i18n.prop($(this).data("i18n")));//翻译placeholder属性值

    })

    }
    })
    }
       var i18n=function(key){
        return $.i18n.prop(key);
       }
    $(document).ready(function(){
    loadProperties('messages','js/i18n/','zh_CN');//调用国际化函数
        console.log(i18n("common.test"));//也可以直接在js里边定义之后调用翻译
    })
    </script>
    </body>
    </html>

    messages_zh.properties文件内容是:

    common.test=u5220u9664u4E91u684Cu9762

  • 相关阅读:
    微软老将Philip Su的离职信:回首12年职场生涯的心得和随笔[转]
    <Programming Ruby 1.9 The Pragmatic Programmer>读书笔记
    Ruby:Update value on specific row but keep the headers
    解决ImportError: cannot import name webdriver
    Ruby几个相关目录
    《发财日记》处处都是名言警句
    软件研发管理最佳实践(20121020 深圳)
    中国过程改进年会会前培训:让敏捷落地! 软件研发管理最佳实践(2012530 北京)
    展示你的才华,成就你的事业!—— 疯狂讲师
    网络直播课程 体验极限编程(XP)
  • 原文地址:https://www.cnblogs.com/sweeeper/p/7607422.html
Copyright © 2011-2022 走看看