dojo的国际化处理

来源：互联网发布：梦想海贼王试炼数据编辑：程序博客网时间：2024/04/27 00:57

作为一个知名的JS库．．dojo的国际化处理非常的值得我们借鉴，以至于当我接触了解了之后，忍不住要想所有人都去使用他，去体验他的效果，当然，也许你已经用过很多其他语言去实现过国际化的功能，那么我想你也会很平滑的过度到来使用dojo的国际化功能，呵呵，废话少说，马上让我们来看看dojo是如何实现国际化的吧．．．

　　国际化标准组织为本地的事件定义了标准的标识符，比如美国的英语用en-us 表示，澳大利亚的英语用en-au 表示，在我们今天的例子里我将使用zh-cn...大陆中文

第一步：捆绑目录和资源文件

　　在dojo中所有的资源文件都用一个JS文件来充当，跟其他的国际化文件一样，所有的资源文件都放在nls文件夹下面，我们将使用一个loginform来命名这个国际化文件包，下面需要创建我们的资源文件的文件夹zh-cn ,zh．这个时候整个国际化包的目录结构就建设好了．．．我们现在要做的就是把我们所需要的资源文件放入相应的目录下．．

　　在我们的例子里将分别在nls,zh,zh-cn目录下放入三个资源文件－－而且都将之命名为loginform.js--

nls:该文件夹下的是默认的资源．．

({

username:"username"

password:"password"

})

zh-cn:

({

username:"用户名"

password:"密码"

})

zh:

({

username:"用户名"

password:"密码"

})

现在我们已经准备好了资源文件．．这是就需要我们把这些资源合适的放入到表单合适的位置，怎么做到呢，这个我们就要进行第二步了．．．

　　第二步：定制标签

我们也会象ＪＡＶＡ中使用占位符一样来定制我们的标签，比如
<span dojoType="dijit.Declaration" widgetClass="LoginformI18n"
      defaults="{ fieldid: 'none' }"> 
    <label for="${fieldid}" id="${fieldid}_label"></label> 
</span>
这个时候我们就需要为我们的标签指定资源文件，怎么做呢．．．
<span dojoType="dijit.Declaration" widgetClass="LoginformI18n"
      defaults="{ fieldid: 'none' }"> 
    <label for="${fieldid}" id="${fieldid}_label"></label> 
var labelNode = dojo.byId(this.fieldid + "_label");var loginFormBundle = dojo.i18n.getLocalization("loginformI18n","loginform");labelNode.innerHTML = loginFormBundle[this.fieldid];
</span>
 
这个时候我们就需要在我们的名称空间里注册我们的标签组件：
        dojo.registerModulePath("loginformI18n","/loginform");
        dojo.requireLocalization("loginformI18n", "loginform");
好了，做完这些我们就需要做第三步了，也就是在我们的ＨＴＭＬ中使用我们注册的具有国际化功能的标签组件，怎么做呢？
 
　　　第三步：使用国际化组件：
  <div dojoType="LoginformI18n" fieldid="username"></div>
  <div dojoType="LoginformI18n" fieldid="password"></div>
 
当然不要忘记了，dojo.require("dijit.Declaration");dojo.require("dojo.parser");呵呵
这个时候整个页面是什么样的呢？看一下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
<html>t
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Googolica Tax Form</title>
<style type="text/css">
        @import "http://o.aolcdn.com/dojo/1.0.0/dijit/themes/tundra/tundra.css";
        @import "http://o.aolcdn.com/dojo/1.0.0/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="/dojoroot/dojo/dojo.js"
        djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
        dojo.require("dojo.parser");
        dojo.require("dijit.form.TextBox");

        dojo.require("dijit.Declaration");      
        // This is necessary to i18n routines look in this directory for the nls folder
        dojo.registerModulePath("loginformI18n","/loginform");
        dojo.requireLocalization("loginformI18n", "loginform");
    </script>
</head>
<body class="tundra">
<span dojoType="dijit.Declaration" widgetClass="LoginformI18n"
        defaults="{ fieldid: 'none' }"> 
        <label for="${fieldid}" id="${fieldid}_label"></label>        
        <script type='dojo/connect'     event='startup'>
        var labelNode = dojo.byId(this.fieldid + "_label");
        var loginFormBundle = dojo.i18n.getLocalization("loginformI18n","loginform");
        labelNode.innerHTML = loginFormBundle[this.fieldid];
        </script> 
</span>
<form>
<div dojoType="LoginformI18n" fieldid="username"></div>
<input type="text" size="20" name="first" dojoType="dijit.form.TextBox"
        trim="true" propercase="true" /><br>
<div dojoType="LoginformI18n" fieldid="password"></div>
<input type="text" size="20" name="last" dojoType="dijit.form.TextBox"
        trim="true" propercase="true" /><br>
</form>


</body>
</html>
 
走到这里你就基本上完成了一个非常简单的dojo国际化的功能．．是不是非常简单呢，至少我觉得很符合我们一般的构建思路，不会觉得很
陌生．．他采用了非常一般化的设计，这也是我为什么觉得它很值得来用一下的原因．．呵呵