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实现文章图片弹出放大效果
Apr 06 jQuery
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 jQuery
jQuery实现IE输入框完成placeholder标签功能的方法
Sep 20 jQuery
jQuery中 DOM节点操作方法大全
Oct 12 jQuery
jquery写出PC端轮播图实例
Jan 26 jQuery
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 jQuery
JQuery样式操作、click事件以及索引值-选项卡应用示例
May 14 jQuery
js/jQuery实现全选效果
Jun 17 jQuery
jQuery zTree插件快速实现目录树
Aug 16 jQuery
JavaScript自动生成 年月范围 选择功能完整示例【基于jQuery插件】
Sep 03 jQuery
JQuery发送ajax请求时中文乱码问题解决
Nov 14 jQuery
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 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
PHP判断远程图片或文件是否存在的实现代码
2014/02/20 PHP
php表单请求获得数据求和示例
2014/05/15 PHP
PHP Curl出现403错误的解决办法
2014/05/29 PHP
php简单复制文件的方法
2016/05/09 PHP
PHP实现给定一列字符,生成指定长度的所有可能组合示例
2019/06/22 PHP
php连接mysql之mysql_connect()与mysqli_connect()的区别
2020/07/19 PHP
常用js字符串判断方法整理
2013/10/18 Javascript
js数组去重的方法汇总
2015/07/29 Javascript
js流动式效果显示当前系统时间
2016/05/16 Javascript
jQuery插件echarts实现的循环生成图效果示例【附demo源码下载】
2017/03/04 Javascript
JS简单获取当前日期时间的方法(如:2017-03-29 11:41:10 星期四)
2017/03/29 Javascript
jquery实现异步加载图片(懒加载图片一种方式)
2017/04/24 jQuery
ES6深入理解之“let”能替代”var“吗?
2017/06/28 Javascript
vue.js中引入vuex储存接口数据及调用的详细流程
2017/12/14 Javascript
vue实现路由懒加载及组件懒加载的方式
2019/06/11 Javascript
浅谈在vue-cli3项目中解决动态引入图片img404的问题
2020/08/04 Javascript
Nuxt pages下不同的页面对应layout下的页面布局操作
2020/11/05 Javascript
Vue——解决报错 Computed property &quot;****&quot; was assigned to but it has no setter.
2020/12/19 Vue.js
Django项目实战之用户头像上传与访问的示例
2018/04/21 Python
python 请求服务器的实现代码(http请求和https请求)
2018/05/25 Python
Python实现分段线性插值
2018/12/17 Python
python实现动态创建类的方法分析
2019/06/25 Python
Python 实现大整数乘法算法的示例代码
2019/09/17 Python
解决Opencv+Python cv2.imshow闪退问题
2020/04/24 Python
Win10下配置tensorflow-gpu的详细教程(无VS2015/2017)
2020/07/14 Python
CSS3实现跳动的动画效果
2016/09/12 HTML / CSS
css3实现信纸/同学录效果的示例代码
2018/12/11 HTML / CSS
银行会计职员个人的自我评价
2013/09/29 职场文书
物流管理毕业生自荐信范文
2014/03/15 职场文书
激励员工的口号
2014/06/16 职场文书
大学生求职信
2014/06/17 职场文书
《中国梦我的梦》中学生演讲稿
2014/08/20 职场文书
奥巴马当选演讲稿
2014/09/10 职场文书
个人遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
大学生学生会工作总结2015
2015/05/26 职场文书
解决ObjectMapper.convertValue() 遇到的一些问题
2021/06/30 Java/Android