方案:
在不同的移动平台(IOS。Android)上,并建立了HTML页面通信框架。主要业务逻辑HTML发展;我要支持多语言开发。
动机:
通过积极主动的信息方式,前一页完成初始化,获取当前语言选项。项。调用相应的JS文件(每种语言相应一个JS文件)解析页面。
实现细节:
- 向本地语言框架发请求获取语言种类。
$(document).on("pageinit",function(){ /*Kaiwii 向本地代码发请求获取当前语言种类*/ });
- 本地语言框架触发回调函数(JS方法):依据语言选项,动态将相应语言的JS文件嵌入HTML而且触发其运行;
/*Kaiwii 本地语言框架回调本方法*/ function GetLanguageCodeCallBack(Jstring,ERROR){ var i18File = $("script[name='i18']"); if(i18File.length==0){//没有成功载入js文件 var i18FileLink = "<script name='i18' src='../../js/i18.js'></script>"; switch (Jstring){ case "EN": i18FileLink = "<script name='i18' src='../../js/i18.js'></script>"; break; case "CN": i18FileLink = "<script name='i18' src='../../js/i18_CN.js'></script>"; break; } $("head").append(i18FileLink); }else{//成功载入js文件 switch (Jstring){ case "EN": $(i18File).attr("src","../../js/i18.js"); break; case "CN": $(i18File).attr("src","../../js/i18_CN.js"); break; } /*主动触发更新HTML*/ updatei18Spans(); } }
- 不同语言相应的JS文件(如i18.js):
1、使用JSON对象存储KEY-VALUE[不同语言版本号的JS文件不过VALUE不同(VALUE为相应语言版本号中的值)];
2、HTML中的静态部分须要调用JS方法改动DOM对象的属性方式完毕多语言动态化(通过调用updatei18spans()触发)。动态部分直接调用就可以。
/*用于国际化*/ <pre name="code" class="javascript">/*Kaiwii*/
/*相应关系表(key为元素的ID,value为国际化下的显示内容*//*span 部分*/var spans = {"DemandDepositAccountTitle":"CCB Current Account"};//本地代码交互的部分var locale_vars = {"enquiryTitle":"Account Info Inquiry"};var i18placeholder = {"请输入单位名称或账号":"Organization‘s Name/Account","
開始日期":"Start Date"," 截止日期":"End Date"};function updatei18Spans(){ for(index in spans){ $("span[i18Id=‘"+index+"‘]").html(spans[index]); } for(index in i18placeholder){ $("input[placeholder=‘"+index+"‘]").attr("placeholder",i18placeholder[index]); }}$(function(){//载入显示内容方法
updatei18Spans(); });
- 调用多语言动态框架改动:
1、静态部分:
HTML上:
<span i18Id="DemandDepositAccountTitle"></span>
2、动态部分:
JS代码中:
liElement += "<span ACC_NO='"+ACC_NO+"' CshEx_Cd='"+CshEx_Cd+"' CcyCd='"+CcyCd+"' onclick='renderBAL(this)' class='font14' style='color:#306ed2'>"+locale_vars.enquiryTitle+"</span>";
版权声明:本文博客原创文章,博客,未经同意,不得转载。