PS:

https://github.com/hzlzh/Front-End-Standards/wiki/HTML-CSS-JS-i18n

本文原始思路起源于此网址,请自行查看。

本文只是简单的一个多语言实现,在刷新时会体现。如果想要更加灵活的应用请自行研究,但是本文一定会对你有所帮助。

正文:

在有想法实现多语言之后,你的第一想法是什么?最简单的想法是一个HTML页面上两个按钮或者链接,然后点击中文就切换中文,点击英文就切换英文。本文的案例是使用两个文字链接,通过cookie实现中英文切换,使点击不同的链接在刷新页面时弹出对应语种的提示框。

所以,问题来了,你要先做什么。

如果没有任何思路,就先搭个框架吧,先写个HTML页面包含两个链接。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<a>中文</a>
<a>English</a>
</body>
</html>

刚刚说了,本文是通过cookie来实现中英文切换的,那么我们就是需要读取cookie然后确定是哪种语言,然后显示相应的提示框。读取cookie,该段代码写在body中,也就是说当cookie读取到chinese时就调用相应的js文件,此处js后面再讲。你只需要知道是对应于该种语言的js即可。

<script>
if (document.cookie.indexOf("chinese") > ) {
document.write("<script src='/js/cn.js'><\/script>");
}
else {
document.write("<script src='/js/en.js'><\/script>");
}
</script>

好了,框架搭好了,然后呢,现在运行只能看见两个链接,点击,毫无反应。那,我们就是想要他点击有反应,所以此时在链接中需要加入href或者onclick等属性,让他能够使用。

<a href="javascript:SetChinese()">中文</a>
<a href="javascript:SetEnglish()">English</a>

这两个方法是干什么的,是客户端的方法,可是方法的实现呢?所以我们要实现这两个方法。在body中添加以下代码:

<script>
function SetEnglish() {
document.cookie = "language=english";
}
function SetChinese() {
document.cookie = "language=chinese"
}
</script>

上述代码是指在点击English时,将文档的cookie设置为"language=english"。

这下HTML页面大致写完了,别忘了,上述我们并没有解释js文件。

英语js脚本en.js对应:

var $lang = {
"用户名": "Please Enter User Name",
"密码": "Please Enter Password"
};

中文js脚本cn.js对应:

var $lang = {
"用户名": "用户名",
"此处用户名不能为空": "此处用户名不能为空"
};

大致解释为,js中存放key-value键值对,可通过key查找对应的value,那么怎么使用呢。此时运行文件并不能打到效果。

我们必须在HTML文件中获取该key:

在body中方法设置的script底部添加以下代码:

var userName = $lang["用户名"];
window.alert(userName);

第一句是在html中获取key,第二句就是通过对话框的形式,验证你的代码是否正确。

本次点击在下次刷新时起作用。

(一)ASP.NET中JavaScript的中英文(多语言)实现方案的更多相关文章

  1. (二)ASP.NET中JavaScript的中英文(多语言)实现方案(二)

    在ASP.NET中JavaScript的中英文(多语言)实现方案中简单的介绍了js实现多语言的一种方案.下面将要讲述另外一种方法,尽管很相似,但是有些地方也是需要细细琢磨的,不说了,先看看. 在Lan ...

  2. asp.net中javascript与后台c#交互

    asp.net中javascript与后台c#交互 作者:熊猫大叔 字体:[增加 减小] 类型:转载 时间:2015-10-23我要评论,出处:http://www.jb51.net/article/ ...

  3. [转]开源框架完美组合之Spring.NET + NHibernate + ASP.NET MVC + jQuery + easyUI 中英文双语言小型企业网站Demo

    热衷于开源框架探索的我发现ASP.NET MVC与jQuery easyUI的组合很给力.由于原先一直受Ext JS框架的licence所苦恼,于是痛下决心寻找一个完全免费的js框架——easyUI. ...

  4. 开源框架完美组合之Spring.NET + NHibernate + ASP.NET MVC + jQuery + easyUI 中英文双语言小型企业网站Demo(转)

    热衷于开源框架探索的我发现ASP.NET MVC与jQuery easyUI的组合很给力.由于原先一直受Ext JS框架的licence所苦恼,于是痛下决心寻找一个完全免费的js框架——easyUI. ...

  5. Asp.net中后台C#数组与前台Javascript数组交互

    摘自:http://blog.csdn.net/a6225301/article/details/20003305 在上一篇<asp.net中javascript与后台c#交互>中实现了前 ...

  6. 【转载】Asp.Net中使用基于jQuery的javascript前台模版引擎JTemplate

    JTemplate是基于jQuery的开源的前端模版引擎,在Jtemplate模板中可以使用if判断.foreach循环.for循环等操作,使用Jtemplate模板优点在于ajax局部刷新界面时候不 ...

  7. ASP.NET 中整合JavaScript的技巧

    尽管ASP.NET提供了一个强壮的平台,但是开发者也不应忽视诸如JavaScript这样成熟的技术.在这篇文章中,Tony Patton将向您解释在Web开发中如何将JavaScript与ASP.NE ...

  8. ASP.NET中使用JavaScript实现图片自动水平滚动效果

    参照网上的资料,在ASP.NET中使用JavaScript实现图片自动水平滚动效果. 1.页面前台代码: <%@ Page Language="C#" AutoEventWi ...

  9. asp.net中的<%%> <%#%> <%=%>形式的详细用法 (转载)

    博客分类: ASP.NET   一. <%%>这种格式实际上就是和asp的用法一样的,只是asp中里面是vbscript或者javascript代码,而在asp.net中是.net平台下支 ...

随机推荐

  1. mysql编译参数详解

    mysql编译参数详解(./configure)   1.--prefix=PREFIX:指定程序安装路径: 2.--enable-assembler:使用汇编模式:(文档说明:compiling i ...

  2. Qt5.4中遇到找不到头文件<QApplication>等。

    从新学习Qt时,重装了Qt5.4,当运行Hello World例子时,遇到了下列的情况 <span style="font-size:18px;">#include & ...

  3. php end()

    end()的用法

  4. ActiviMQ(1)

    1. ActiviMQ是实现JMS接口和规范的消息中间件(Provider), 2. JMS,Java Message Service, java消息服务,是JavaEE中的一个技术 3. JMS规范 ...

  5. further occurrences of HTTP header parsing errors will be logged at DEBUG level.

    1.   获取参数Json的值为null String json=request.getParameter("Json"); 首先检查是否有下面的东东, 信息: Error par ...

  6. <转>CentOS 7 安装配置 NFS

    CentOS 7  安装配置 NFS 环境 nps 192.168.1.97 client 192.168.1.98 一.yum 安装 yum -y install nfs-utils rpcbind ...

  7. 转:Oracle里几组重要的视图--v$sysstat,v$system_event,v$parameter v$system_parameter

    按组分的几组重要的性能视图 1.System 的 over view v$sysstat , v$system_event  , v$parameter,V$instance得到oracle_sid ...

  8. zabbix 在linux上安装以及一些配置

    本文章将演示zabbix 3.2版本的安装,供有需要的伙伴们参考: 网络也有很多关于zabbix的安装文档,甚至每一步的配置都有详细的截图,我这里就不演示截图了,多配置几次自然就熟练了.多折腾. 楼主 ...

  9. python学习(一) 基础知识

    开始学习<Python基础教程> 1.2 交互式解释器 按照书上的例子敲了个最简单的print函数,居然报错: >>> print "fsdfs"Sy ...

  10. VC++使用TCHAR

    #ifdef _UNICODE #define tcout wcout #define tcin wcin #else #define tcout cout #define tcin cin #end ...