实现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.首先创建应用程序的快捷方式 找到自己想加入开机 ...
随机推荐
- 一些Xcode 5的使用提示和技巧
摘自:http://www.cocoachina.com/newbie/env/2014/0127/7766.html 感谢论坛成员郭亚鑫的热心翻译. 在iOS开发中,Xcode 是最使用最多的I ...
- wamp安装后打开默认网页显示dir,图标红点
首先网页显示dir,是因为服务这些没启动,跟图标红点是一个原因,解决了图标红点,就能解决只显示dir的问题. 先测试是不是端口占用问题,如图: 如果是,那就继续往下走. 单击图标左键(记住是左键),然 ...
- vi/vim高级命令集粹
vi/vim高级命令集粹 (ctrl +v过来 留着以后看) 1.交换两个字符位置 xp 2.上下两行调换 ddp 3.把文件内容反转 :g/^/m0/ (未通过) 4.上下两行合并 J 5.删除所有 ...
- fileziller 恢复 站点管理器 内的ftp帐号方法
由于系统坏了重装了系统,以前的fileziller中配置的服务器链接信息列表很多,新装fileziller后即使复制以前的安装目录过来,站点管理器内还是空荡荡的. 这些服务器链接的配置信息非常重要,如 ...
- Adrnoid开发系列(二十五):使用AlertDialog创建各种类型的对话框
AlertDialog能够生成各种内容的对话框.可是每种对话框都会有这样的的结构: 类似下边这样的的: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTA ...
- mysql学习之中的一个:mysql安装
我用的时mac系统,本来想在mac系统上装一个,可是发现mac系统始终无法用password登入到本机server,很奇怪的问题(在stackflow上看了些回复,也没有找到原因),最后仅仅好装到虚拟 ...
- linux scp传文件
一.输入 scp 201207.tar.gz root@192.1001.122:/backup 二.输入密码:abc123 注解: scp 201207.tar.gz :将要传输的文件 root : ...
- 基于visual Studio2013解决C语言竞赛题之1091多项式
题目 解决代码及点评 /************************************************************************/ /* ...
- HTML语言简单回顾
简单复习一下html语言. html的基本结构如下: <html> <head> <title></title> </head> <b ...
- strip 命令的使用方法
用途 通过除去绑定程序和符号调试程序使用的信息,降低扩展公共对象文件格式(XCOFF)的对象文件的大小. 语法 strip [ -V ] [ -r [ -l ] | -x [ -l ] | -t | ...