jQuery实现的中英文切换功能示例


Posted in jQuery onJanuary 11, 2019

本文实例讲述了jQuery实现的中英文切换功能。分享给大家供大家参考,具体如下:

1.html

<!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=utf-8" />
<title>中英文切换</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="js/language.js"></script>
</head>
<body>
 <button id="change">中英文切换</button>
 <div style="text-align: center">
  你好
 </div>
</body>
<script type="text/javascript">
 $("#change").click(function() {
  translate();
 })
</script>
</html>

2.language.js

$(function(){
 // do something
 var script=document.createElement("script");
 script.type="text/javascript";
 script.src="js/translate.js";
 document.getElementsByTagName('head')[0].appendChild(script);
 var value = sessionStorage.getItem("language");
 document.onreadystatechange = function () {
  if (document.readyState == 'complete') {
   if(value==="1"){
    Microsoft.Translator.Widget.Translate('zh-CHS', 'en', onProgress, onError, onComplete, onRestoreOriginal, 2000);
   }
  }
 }
 function onProgress(value) {
 }
 function onError(error) {
 }
 function onComplete() {
  $("#WidgetFloaterPanels").hide();
 }
 function onRestoreOriginal() {
 }
});
function translate(){
 var value = sessionStorage.getItem("language");
 if(value==="1"){
  sessionStorage.setItem("language", "0");
 }else{
  sessionStorage.setItem("language", "1");
 }
 window.location.reload();//刷新当前页面.
}

3.translate.js是将http://www.microsoftTranslator.com/ajax/v3/WidgetV3.ashx?siteData=ueOIGRSKkd965FeEGM5JtQ**的源码下载下来的,并将里面

<1> J = "block", ib = "inline-block",都改成等于none

<2>s.style.color = q;s.style.backgroundColor = p两行注释

目的是去除翻译后出现的弹框和hover效果

最后:

jQuery实现的中英文切换功能示例

jQuery实现的中英文切换功能示例

附:完整实例代码点击此处本站下载

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery实现的动态文字变化输出效果示例【附演示与demo源码下载】
Mar 24 jQuery
jQuery自定义图片上传插件实例代码
Apr 04 jQuery
jquery dataTable 后台加载数据并分页实例代码
Jun 07 jQuery
jQuery访问浏览器本地存储cookie、localStorage和sessionStorage的基本用法
Oct 20 jQuery
jQuery封装animate.css的实例
Jan 04 jQuery
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 jQuery
使用jquery的cookie实现登录页记住用户名和密码的方法
Mar 13 jQuery
如何使用CSS3+JQuery实现悬浮墙式菜单
Jun 18 jQuery
jQuery中DOM常见操作实例小结
Aug 01 jQuery
jQuery实现中奖播报功能(让文本滚动起来) 简单设置数值即可
Mar 20 jQuery
Jquery cookie插件实现原理代码解析
Aug 04 jQuery
jQuery实现穿梭框效果
Jan 19 jQuery
jQuery简单实现根据日期计算星期几的方法
Jan 09 #jQuery
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 #jQuery
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 #jQuery
jQuery实现的别踩白块小游戏完整示例
Jan 07 #jQuery
jQuery判断自定义属性data-val用法示例
Jan 07 #jQuery
jQuery实现的简单歌词滚动功能示例
Jan 07 #jQuery
jQuery实现获取当前鼠标位置并输出功能示例
Jan 05 #jQuery
You might like
动态新闻发布的实现及其技巧
2006/10/09 PHP
PHP中常用的转义函数
2014/02/28 PHP
PHP mysql事务问题实例分析
2016/01/18 PHP
PHP面向对象类型约束用法分析
2019/06/12 PHP
JObj预览一个JS的框架
2008/03/13 Javascript
jQuery 菜单随滚条改为以定位方式(固定要浏览器顶部)
2012/05/24 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(四)用地图块拼成大地图
2013/01/23 Javascript
jQuery多项选项卡的实现思路附样式及代码
2014/06/03 Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
2014/06/20 Javascript
实例代码讲解jquery easyui动态tab页
2015/11/17 Javascript
chrome下判断点击input上标签还是其余标签的实现方法
2016/09/18 Javascript
微信小程序 获取设备信息 API实例详解
2016/10/02 Javascript
轻松理解Javascript变量的相关问题
2017/01/20 Javascript
JS+CSS实现滚动数字时钟效果
2017/12/25 Javascript
小程序如何自主实现拦截器的示例代码
2019/11/04 Javascript
Vue开发环境跨域访问问题
2020/01/22 Javascript
JS实现网页端猜数字小游戏
2020/03/06 Javascript
[44:10]2018DOTA2亚洲邀请赛 4.5 淘汰赛 EG vs VP 第一场
2018/04/06 DOTA
python切换hosts文件代码示例
2013/12/31 Python
Python中的二维数组实例(list与numpy.array)
2018/04/13 Python
使用python将图片按标签分入不同文件夹的方法
2018/12/08 Python
jupyter notebook 多环境conda kernel配置方式
2020/04/10 Python
Appium+Python实现简单的自动化登录测试的实现
2021/01/26 Python
CSS3实现淘宝留白的方法
2020/06/05 HTML / CSS
欧尚俄罗斯网上超市:Auchan俄罗斯
2018/05/03 全球购物
牵手50新加坡:专为黄金岁月的单身人士而设的交友网站
2020/08/16 全球购物
酒店个人培训自我鉴定
2013/12/11 职场文书
运动会通讯稿500字
2014/02/20 职场文书
小学二年级学生评语
2014/04/21 职场文书
幸福家庭标语
2014/06/27 职场文书
道路运输企业安全生产责任书
2014/07/28 职场文书
中韩经贸翻译专业大学生职业生涯规划范文
2014/09/18 职场文书
2014年财务科工作总结
2014/11/11 职场文书
2014年文员工作总结
2014/11/18 职场文书
环卫处个人工作总结
2015/03/04 职场文书
PostgreSQL聚合函数介绍以及分组和排序
2022/04/12 PostgreSQL