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插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
jQuery实现分页功能(含ajax请求、后台数据、附完整demo)
Apr 03 jQuery
Jquery获取radio选中的值
May 05 jQuery
jQuery实现web页面樱花坠落的特效
Jun 01 jQuery
jQuery Validate表单验证插件实现代码
Jun 08 jQuery
jQuery修改DOM结构_动力节点Java学院整理
Jul 05 jQuery
基于jQuery Easyui实现登陆框界面
Jul 10 jQuery
jQuery实现简单日期格式化功能示例
Sep 19 jQuery
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 jQuery
基于jQuery实现可编辑的表格
Dec 11 jQuery
jQuery实现动态操作table行
Nov 23 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
合并ThinkPHP配置文件以消除代码冗余的实现方法
2014/07/22 PHP
PHP+MySQL高并发加锁事务处理问题解决方法
2018/04/30 PHP
学习YUI.Ext第七日-View&amp;JSONView Part Two-一个画室网站的案例
2007/03/10 Javascript
JavaScript this 深入理解
2009/07/30 Javascript
JavaScript下通过的XMLHttpRequest发送请求的代码
2011/06/28 Javascript
caller和callee的区别介绍及演示结果
2013/03/10 Javascript
struts2+jquery组合验证注册用户是否存在
2014/04/30 Javascript
Javascript基础教程之JavaScript语法
2015/01/18 Javascript
jquery中ready()函数执行的时机和window的load事件比较
2015/06/22 Javascript
浅谈JavaScript中小数和大整数的精度丢失
2016/05/31 Javascript
es7学习教程之fetch解决异步嵌套问题的方法示例
2017/07/21 Javascript
使用use注册Vue全局组件和全局指令的方法
2018/03/08 Javascript
vue组件通信传值操作示例
2019/01/08 Javascript
Fundebug支持监控微信小程序HTTP请求错误的方法
2019/02/21 Javascript
javascript实现小型区块链功能
2019/04/03 Javascript
Vue Element UI + OSS实现上传文件功能
2019/07/31 Javascript
nodejs制作小爬虫功能示例
2020/02/24 NodeJs
JS实现烟花爆炸效果
2020/03/10 Javascript
JavaScript中交换值的10种方法总结
2020/08/18 Javascript
[01:37]TI4西雅图DOTA2前线报道 VG拿下首胜教练357给出获胜秘诀
2014/07/10 DOTA
[56:18]VGJ.S vs Secret 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
在Django的URLconf中进行函数导入的方法
2015/07/18 Python
Python中将字典转换为列表的方法
2016/09/21 Python
python 中的divmod数字处理函数浅析
2017/10/17 Python
Python绘制KS曲线的实现方法
2018/08/13 Python
python循环嵌套的多种使用方法解析
2019/11/29 Python
详细分析Python可变对象和不可变对象
2020/07/09 Python
Python爬虫实例——scrapy框架爬取拉勾网招聘信息
2020/07/14 Python
Python xlwings插入Excel图片的实现方法
2021/02/26 Python
李维斯牛仔裤英国官方网站:Levi’s英国
2019/10/10 全球购物
商场中秋节广播稿
2014/01/17 职场文书
金融学专科生自我鉴定
2014/02/21 职场文书
群众路线教育实践活动对照检查材料
2014/09/22 职场文书
2015年乡镇工会工作总结
2015/05/19 职场文书
母亲去世追悼词
2015/06/23 职场文书
Java常用工具类汇总 附示例代码
2021/06/26 Java/Android