JavaScript快速切换繁体中文和简体中文的方法及网(7)

繁简的转换基本如此了。值得一提的是,浏览器其实替我们识别语言环境的变量,主要是 navigator.userLanguage || navigator.language。这个变量在服务端也可以获取,头读取:Request.ServerVariables("http_accept_language")。

/** * 默认是否正体中文:true为正体;false简体。 HTTP * 头读取:Request.ServerVariables("http_accept_language") * * @return {Boolean} */ function getClientLanguage() { var s = navigator.userLanguage || navigator.language; switch (s.toLowerCase()) { case 'zh-cn': return false; case 'zh-tw': return true; default: return null; } }

最后我们还通过 cookie 来保存语言状态。

下面给大家介绍下三步让你的网站支持简体繁体切换

不少网站为了更好地照顾不同用户使用简体/繁体的阅读习惯,会提供简体繁体两种版本字体切换,提高用户体验。例如hexo虽然作者是来自台湾的,但是hexo的官网不仅提供了适合台湾同胞阅读的繁体中文版,还提供了适合我们内地同胞阅读的简体中文版,照顾了我们这些习惯使用简体读写的大陆用户,hexo得到了不少内地忠实粉丝追捧。同样,我们也可以提供繁体版来照顾那些使用繁体字的台湾、香港同胞阅读习惯。

具体实现:

首先,点击这里右键另存下载简繁字体切换所需的 tw_cn.js 文件,上传到自己的网站空间。
其次,修改模板,在你想要显示简繁转换按钮的地方加上下面一段代码,正常情况添加到 header.php 或者 siderbar.php 就可以了。

<a href="javascript:translatePage();">繁體</a>

最后,在footer.php添加下面代码,记得更改 cookieDomain 这一项。

<script type="text/javascript" src="https://www.arao.me/js/tw_cn.js"></script> <script type="text/javascript"> var defaultEncoding = 2; //网站编写字体是否繁体,1-繁体,2-简体 var translateDelay = 0; //延迟时间,若不在前, 要设定延迟翻译时间, 如100表示100ms,默认为0 var cookieDomain = "http://www.arao.me/"; //Cookie地址, 一定要设定, 通常为你的网址 var msgToTraditionalChinese = "繁體"; //此处可以更改为你想要显示的文字 var msgToSimplifiedChinese = "简体"; //同上,但两处均不建议更改 var translateButtonId = "translateLink"; //默认互换id translateInitilization(); </script>

这就基本完成了简体繁体切换功能,不管你是hexo,jelly,Octopress等静态博客,还是wordpress,typecho,emlog,Z-Blog等动态的,都可以用上。具体的演示效果可以点击我博客底部简体中文切换字体,至于简体繁体切换按钮嘛,文字和样式可以按个人喜好自行更改。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgyffj.html