实现web多语言可能有多种解决办法,现在分享一种比较简单的思路,这篇文章主要用于记录学习过程,肯定存在不少谬误,欢迎批评指正。

web多语言实现最简单的一种方法可能是每一种语言一套代码,但这样存在一个问题就是维护起来十分不方便。

所以最好是把数据(语言文字)从代码中分离出来,然后共用一套代码,这样维护起来方便。

下面介绍的一种办法是用XML存储数据,用javascript 来解析XML,将数据动态的生成到HTML中。

1 登录页面:主要用来切换语言,当选择英文登录后,整个界面就显示为英文,在此的一个主要问题是,要用一个变量做为全局变量

用于标识当前选择了哪种语言,但是地这个变量可能只局限于当前页面,那如何将这个变量传给其它页面呢?这里用的是cookie,当然也可以用其它方法。

当在登录页面选择英文时,此时将变量设置到cookie中,在其它页面加载时,首先去cookie中取这个变量,检查这个变量的值,如果是英文,则显示英文。

var lantag
function getCookie(c_name)
{
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1)
{
c_start=c_start + c_name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
} function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
} function checkCookie()
{
lantag =getCookie('lantag') if (lantag ==null ||lantag =="")
{
setCookie('lantag','zh',365) }
}

2可以将页面中的文字用<span id="ti"></span>标签代替,然后用JS 将HTML中相应的内容,用XML中相应的内容替换.

普通文字:

document.getElementById("ti").innerHTML=xmlDoc.getElementsByTagName("ti")[0].childNodes[0].nodeValue

button:

document.getElementById("login").value=xmlDoc.getElementsByTagName("login")[0].childNodes[0].nodeValue;

var lantag
var tag
function changetag(tag)
{
setCookie('lantag',tag,365)
login_language(); } function login_language()
{
var xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false";
lantag=getCookie('lantag'); if(lantag =='zh')
{
xmlDoc.load("zh.xml");
document.getElementById("ti").innerHTML=xmlDoc.getElementsByTagName("ti")[0].childNodes[0].nodeValue;
document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("pwd").innerHTML=xmlDoc.getElementsByTagName("pwd")[0].childNodes[0].nodeValue;
document.getElementById("login").value=xmlDoc.getElementsByTagName("login")[0].childNodes[0].nodeValue;
}
else if(lantag=='en')
{
xmlDoc.load("en.xml");
document.getElementById("ti").innerHTML=xmlDoc.getElementsByTagName("ti")[0].childNodes[0].nodeValue;
document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("pwd").innerHTML=xmlDoc.getElementsByTagName("pwd")[0].childNodes[0].nodeValue;
document.getElementById("login").value=xmlDoc.getElementsByTagName("login")[0].childNodes[0].nodeValue;
}
} }

3 Index 页面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript" src="lan.js"></script>
<title>login</title>
</head> <body onload="focus_text();checkCookie();login_language()">
<div align="right">
<a href="javascript:changetag('zh')">中文</a>|<a href="javascript:changetag('en')">English</a>
</div>
<table width="800" height="100" border=0 align="center">
</table>
<table width="404" height="284" border=0 align="center"background="./image/Load_background.png" >
<form id="form1" name="form1" method="post" action="">
<tr height ="40"></tr>
<tr height ="40"><td colspan="3"align="center"><span id="ti"></span></td></tr>
<tr height ="40">
<td width ="40" ></td>
<td width ="80" align="left" ><span id="to"></span></td>
<td align="left"><input name="input_name" type="text" id="input_name" value="" style="width:180px;height:18px" maxlength="24" /></td>
</tr>
<tr height ="40">
<td width ="40"></td>
<td width ="80" align="left" ><span id="pwd"></span></td>
<td align="left"><input name="input_pass" type="password" id="input_pass" style="width:180px;height:18px" maxlength="24"/></td>
</tr>
<tr height ="40"> <td colspan="3" align="center"><input name="login" type="button" id="login" onclick="validate()" style="font-size:14px;" value="" width:45px; height:19px;/></td> </tr>
<tr ></tr>
</form>
</table>
<br> </body>
</html>

4 XML可以这样设置

<?xml version="1.0" encoding='gb2312'?>
<en>
<log_in>
<ti>Decoder</ti>
<to>UserName:</to>
<pwd>Password:</pwd>
<login>Login</login>
</log_in>
</en>

实现web多语言的一种解决办法的更多相关文章

  1. eclipse或tomcat web项目启动失败其中一种解决办法

    失败信息如下: java.util.concurrent.ExecutionException: org.apache.catalina.LifecycleException: Failed to s ...

  2. Unity多单位战斗寻路问题的一种解决办法

    Unity多单位战斗寻路问题的一种解决办法 Unity提供了NavMesh 导航组件   NavMesh是在实践中通用性最好的一种导航方式,但是Unity的实现并没有完全提供一个开放自由的API. 主 ...

  3. 64位Ubuntu运行32位程序时报文件不存在(No such file or Directory)的一种解决办法

    尝试在64位Ubuntu下面运行32位程序时, 一直说 文件不存在(No such file or directory), 我只想说++. 你tm说个文件格式不正确不就好了? 非得说个文件不存在! 真 ...

  4. (转)eclipse安装ADT插件重启后不显示Android SDK Manager和Android Virtual Device Manager图标的一种解决办法

    文章来源:http://blog.csdn.net/zcyhappy1314/article/details/8307534 下面说的这种情况是在正确安装ADT插件的前提下,重启eclipse后,工具 ...

  5. 百度地图API显示多个标注点,解决提示信息问题以及给标注增加地图旁的文字连接提示的另一种解决办法

    原文:百度地图API显示多个标注点,解决提示信息问题以及给标注增加地图旁的文字连接提示的另一种解决办法 公司的网站改版要求在一个页面显示百度地图.上面要同时显示很多标注点,标注点当然要有提示信息嘛,提 ...

  6. No Spring WebApplicationInitializer types detected on classpath 问题的一种解决办法

    今天在idea中编译部署工程,tomcat报了这个错误: No Spring WebApplicationInitializer types detected on classpath 导致前端页面访 ...

  7. [Android]Eclipse 安装 ADT[Android Development Tooling] 失败的两种解决办法

    原因 最近想在新装的 Win7 里搭建一下 Android 的开发环境,虽然现在有 Android Studio 了,不过还是习惯 Eclipse 一点.众所周知的原因,Eclipse 直接安装 AD ...

  8. 在win7系统下安装把Ubuntu17.04安装在另一个硬盘开机无法进入Ubuntu问题的一种解决办法。【转】

    本文转载自:http://blog.csdn.net/u012879090/article/details/74937762 在win7系统下安装把Ubuntu17.04安装在另一个硬盘开机无法进入U ...

  9. win10应用程序添加到开机启动项的两种解决办法

    原文 win10应用程序添加到开机启动项的两种解决办法 在windows10系统中,如果想让应用程序在开机之后自动运行起来,可以怎么做呢? 方法一: 1.首先创建应用程序的快捷方式 找到自己想加入开机 ...

随机推荐

  1. Menu的自己定义实现-------保卫萝卜造塔升级塔菜单实现

    cocos2dx原生的menu排版函数实现的非常无完整,像最主要的Item的排序要想做得略微美丽一些就须要我们自己实现. 对于Menu我们能够用两种方法来实现: 1.大神级别. 继承自Control, ...

  2. SQL__用命令删除定期的备份数据库文件

    用计划任务可以定期执行下列语句: FORFILES /P e:\test /M *.bak /C "cmd /C del /Q @path" /d -4 其中可更换目录与文件类型. ...

  3. BZOJ AC 200题留念

    话说本来想200AC就把题目总结一下...但是我现在挺懒的..不想弄...以后再来吧.

  4. 03-UIKit、VC之间正向反向传值、代理

    目录: 一.正向传值 二.反向传值 三.代理模式 回到顶部 正向传值:就是把第一个界面的值传给第二个界面显示,其简单实现方法 1 首先在第一个界面中要有一个textField输入框,一个按钮butto ...

  5. Git命令非主流札记

    使用git做开发的版本管理也有一年半之多了,但是始终都是常用的branch commit status diff push等一些再常用不过的命令,最近闲下来,打算学习一下高端用法,所以就静下心来好好读 ...

  6. HDU 4336 Card Collector(动态规划-概率DP)

    Card Collector Problem Description In your childhood, do you crazy for collecting the beautiful card ...

  7. spring利用扫描方式对bean的处理(对任何版本如何获取xml配置信息的处理)

    利用扫描的方式将组件注入容器,就也可以不用操作bean来实例化对象了. 下面我做一个例子 我用的spring3.2.2版本的 首先写一个spring.xml. <?xml version=&qu ...

  8. log4net学习目录

    log4net是用来记录日志的,日志是用来帮助我们排除错误和异常的.这是我们编写软件必须要用到的东西,前面总结了一些有关日志和log4net的文章,在这整理个目录东大家参考. C#日志工具汇总 log ...

  9. Spring 从零開始-05

    最终能到Spring的AOP编程了,AOP的概念特别的多.所以须要你在開始之前有点了解,然后通过代码慢慢学习! - 切面(Aspect):一个关注点的模块化,这个关注点实现可能另外横切多个对象.事务管 ...

  10. sql: sql developer使用

    在sql developer中登陆某数据库,在procedure里面加入一个proc,种类选ARBOR: CREATE OR REPLACE PROCEDURE PROCEDURE23 IS NAM ...