实现web多语言的一种解决办法
实现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多语言的一种解决办法的更多相关文章
- eclipse或tomcat web项目启动失败其中一种解决办法
失败信息如下: java.util.concurrent.ExecutionException: org.apache.catalina.LifecycleException: Failed to s ...
- Unity多单位战斗寻路问题的一种解决办法
Unity多单位战斗寻路问题的一种解决办法 Unity提供了NavMesh 导航组件 NavMesh是在实践中通用性最好的一种导航方式,但是Unity的实现并没有完全提供一个开放自由的API. 主 ...
- 64位Ubuntu运行32位程序时报文件不存在(No such file or Directory)的一种解决办法
尝试在64位Ubuntu下面运行32位程序时, 一直说 文件不存在(No such file or directory), 我只想说++. 你tm说个文件格式不正确不就好了? 非得说个文件不存在! 真 ...
- (转)eclipse安装ADT插件重启后不显示Android SDK Manager和Android Virtual Device Manager图标的一种解决办法
文章来源:http://blog.csdn.net/zcyhappy1314/article/details/8307534 下面说的这种情况是在正确安装ADT插件的前提下,重启eclipse后,工具 ...
- 百度地图API显示多个标注点,解决提示信息问题以及给标注增加地图旁的文字连接提示的另一种解决办法
原文:百度地图API显示多个标注点,解决提示信息问题以及给标注增加地图旁的文字连接提示的另一种解决办法 公司的网站改版要求在一个页面显示百度地图.上面要同时显示很多标注点,标注点当然要有提示信息嘛,提 ...
- No Spring WebApplicationInitializer types detected on classpath 问题的一种解决办法
今天在idea中编译部署工程,tomcat报了这个错误: No Spring WebApplicationInitializer types detected on classpath 导致前端页面访 ...
- [Android]Eclipse 安装 ADT[Android Development Tooling] 失败的两种解决办法
原因 最近想在新装的 Win7 里搭建一下 Android 的开发环境,虽然现在有 Android Studio 了,不过还是习惯 Eclipse 一点.众所周知的原因,Eclipse 直接安装 AD ...
- 在win7系统下安装把Ubuntu17.04安装在另一个硬盘开机无法进入Ubuntu问题的一种解决办法。【转】
本文转载自:http://blog.csdn.net/u012879090/article/details/74937762 在win7系统下安装把Ubuntu17.04安装在另一个硬盘开机无法进入U ...
- win10应用程序添加到开机启动项的两种解决办法
原文 win10应用程序添加到开机启动项的两种解决办法 在windows10系统中,如果想让应用程序在开机之后自动运行起来,可以怎么做呢? 方法一: 1.首先创建应用程序的快捷方式 找到自己想加入开机 ...
随机推荐
- BNU 26579 Andrew the Ant 【蚂蚁】
链接: http://www.bnuoj.com/bnuoj/problem_show.php?pid=26579 http://www.bnuoj.com/bnuoj/contest_show.ph ...
- [概率dp] ZOJ 3822 Domination
题意: 给N×M的棋盘.每天随机找一个没放过棋子的格子放一个棋子 问使得每一个每列都有棋子的天数期望 思路: dp[i][j][k] 代表放了i个棋子占了j行k列 到达目标状态的期望 然后从 dp[n ...
- uC/OS II 函数说明 之–OSTaskCreate()与OSTaskCreateExt()
1. OSTaskCreate() OSTaskCreate()建立一个新任务,能够在多任务环境启动之前,或者执行任务中建立任务.注意,ISR中禁止建立任务,一个任务必须为无限循环结构. ...
- hdu1397(素数组和成偶数的个数 用 标记法)
Problem Description Goldbach's Conjecture: For any even number n greater than or equal to 4, there e ...
- PHP - FTP上传文件类
/** * 作用:FTP操作类( 拷贝.移动.删除文件/创建目录 ) * 时间:2006/5/9 * 作者:欣然随风 * QQ:276624915 */ class class_ftp { publi ...
- C++静态库中使用_declspec(dllexport) 不能导出函数的问题
在某项目中,有一些静态库,这些静态库中有类型命名的函数GET_XXX.在一次项目结构调整的时候,我想将调用这静态库的代码编译成DLL,并且将这些Get函数导出,我就直接就这些函数前面添加了_decls ...
- listview滑动
单击其中的一个item时,让这个item能滚动的listview的顶部.现在用 list.scrollTo(0, item.getTop()); 实现啦 android listview滚动到顶部 转 ...
- c++ 中CImage类Load函数,路径中含有空格应对策略!
最近,在写一些东西的时候,需要用到CImage类将JPG各式的图片转换成BMP图片,传入的是图片的绝对地址:如C:\Users\Administrator\Documents\Visual Studi ...
- 基于visual Studio2013解决C语言竞赛题之1006填空
题目 解决代码及点评 /************************************************************************/ ...
- input标签的hidden属性的应用及作用
定义:传输关于客户端/服务器交互的状态信息. Transmits state information about client/server interaction. 解释: 此元素在页面中不显示,在 ...