JS中文简繁体转换【演示-源码下载】
中文简繁体转换,使用一个JS核心文件,就可实现,原来这么简单。
JS中文简繁体转换
下面介绍一下实现方法,文章内容含效果演示及源码下载。
HTML完整代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit">
<title>js中文简体繁体转换</title>
<style>
body {
background: #dddddd
}
.container {
max-width: 600px;
height: auto;
margin: auto;
padding: 50px 0px;
font-family: "microsoft yahei"
}
.top {
width: 100%;
height: 50px;
line-height: 50px;
margin-bottom: 15px;
}
.top a {
width: 140px;
height: 40px;
display: block;
float: left;
margin-right: 10px;
text-align: center;
line-height: 40px;
color: #00A1DF;
text-decoration: none;
}
.detail {
width: 500px;
height: 300px;
padding: 10px;
line-height: 28px;
text-indent: 0px;
border: 5px solid #00A1DF;
}
</style>
</head>
<body>
<div class="container">
<div class="top"> <a href="javascript:zh_tran('s');" class="zh_click" id="zh_click_s">简体</a> <a href="javascript:zh_tran('t');" class="zh_click" id="zh_click_t">繁體</a> </div>
<textarea class="detail">js中文简体繁体转换</textarea>
</div>
<script type="text/javascript" src="js/chinese.js"></script>
</body>
</html>
execcodegetcode
HTML代码引用了一个js文件chinese.js,这是中文简繁体转换的核心文件。该文件包含在源码下载的压缩包里,这里解释几个变量,我们可以通过更改变量参数来实现不同的效果,例如是否需要缓存、默认是简体还是繁体。
1、设置默认字体和缓存时间
打开网页时你要显示什么字体?可以通过参数zh_choose
来设置,s表示默认简体,t表示是繁体。
一般不需要缓存内容,把参数zh_expires
设置为-1。
var zh_choose='t'; /* s表示默认简体 t是繁体*/
var zh_expires=-1; /* 缓存天数 -1表示不要缓存*/
2、简体繁体按钮的class名称
var zh_class='zh_click';
参数zh_class
值zh_click是HTML代码里简体繁体的按钮class名称和id前缀,如下面代码。
<a href="javascript:zh_tran('s');" class="zh_click" id="zh_click_s">简体</a>
<a href="javascript:zh_tran('t');" class="zh_click" id="zh_click_t">繁體</a>