转自:http://rainlife.iteye.com/blog/161713
不知道大家对于javascript中的消息资源是如何做国际化的,对于页面文件来说,可以使用一些国际化的开源东东,像struts的〈bean:message〉,或者使用JSTL的fmt,但在js文件中,却无法使用这类的东西,一种变通的办法,就是在jsp中定义一些javascript的常量,这些常量的值为国际化资源文件中定义的信息,然后在js代码中去使用定义好的这些常量。
另一个方法,像FCKEditor这样,直接使用javascript来实现javascript的国际化。而这样的实现方法,也并不困难。
javascrip中的一个navigator的内置对象,包含了正在使用的 Navigator 的版本信息。
属性概览
这里的appName应该都比较熟悉,可以用它来判断不同的浏览器,像ie ,firefox等。
navigator还有一个language的属性,
IE代码:
navigator.userLanguage
非IE代码:
navigator.language
它的返回值为用户所在的语言环境,与java中的Locale类似,比如说我在中文环境下,则返回"zh-CN"。
这样,就可以根据返回的language的不同,来定位到不同的message_XXX.js资源文件中。
比如说定义两个js资源文件:
message_en.js
var Lang = { hello : "Hello World!" }
message_zh-CN.js
var Lang = { hello : "你好,世界!" }
我们就可以在js代码中直接使用Lang[key](这里的key为hello)实现资源信息的国际化。
另外,像FCKEditor,在HTML页面中,也使用javascript来做国际化,像下面的代码:
<span fckLang="PlaceholderDlgName">Placeholder Name</span><br>
通过为span这个标签增加一个fckLang="XXX"的属性,这里的"XXX",就是定义在资源js文件中的(像上面的"hello")。
这是如何实现的呢?
先定义一个TranslatePage(A)的方法,参数A为一个DOM对象:
function TranslatePage(A) { this.TranslateElements(A, 'SPAN', 'innerHTML', false); }
在TranslatePage方法内部,又调用了TranslateElements的方法:
/** * @param A DOM对象 * @param B 国际化的HTML标签 * @param C 国际化标签的innerHTML或innerText * @param D 是否转换HTML的标签 */ var TranslateElements = function(A, B, C, D) { var e = A.getElementsByTagName(B);//实际上就是根据标签名取到这个标签的数据集合 var E,s; for (var i = 0; i < e.length; i++) { if (E = e[i].getAttribute('fckLang')) { //如果这个标签中有'fckLang'的属性的,说明它是要实现国际化的 if (s = Lang[E]) { if (D) s = HTMLEncode(s);//是否处理HTML标签 eval('e[i].' + C + ' = s');//这个实际上就是执行XXX.innerHTML='XXXX' } } } }
下面这个是HTMLEncode方法的实现:
var HTMLEncode = function(A) { if (!A) return ''; A = A.replace(/&/g, '&'); A = A.replace(/</g, '<'); A = A.replace(/>/g, '>'); return A; }
实际上就是将"〈"和“〉”这样的标签转换一下。
这样的实现,不禁让我想到了Tapestry,通过在HTML标签中增加一个“jwcid”的属性,这标识这个HTML标签是一个Tapestry的组件,通过Tapestry的处理,再将结果返回重新渲染由jwcid这个属性标识的HTML标签。