toggle()隐藏问题的解决方法


Posted in Javascript onFebruary 17, 2014

最近编写一个实例的时候使用到toggle函数,但是调用的时候会把元素隐藏掉,之前使用过也只是多个事件轮流切换罢了。百思不得其解于是就在网上搜索查看jQuery API文档。终于发现了原因:
原来在jQuery 1.9版本之后,toggle()发生了变化,以下是官网的Notes:
Note: This method signature was deprecated in jQuery 1.8 and removed in jQuery 1.9. jQuery also provides an animation methodnamed .toggle() that toggles the visibility of elements. Whether the animation or the event method is fired depends on the set of argumentspassed.
在早期的版本,存在两个同名的toggle(),但是所执行的方法却是不一样的:
.toggle( handler(eventObject), handler(eventObject) [, handler(eventObject) ] )
Description: Bind two or more handlers to the matched elements, to be executed on alternate clicks.
=====================================================
.toggle( [duration ] [, complete ] )
Description: Display or hide the matched elements.
而之后的版本把第一个toggle()函数给去掉了,导致用于调用切换功能时会把元素隐藏了。
========================
既然去掉了这个函数,但是实现需求还是要的。怎么来实现多个事件的轮流切换了?
可以通过click事件判断不同的情况来触发,或者通过设置一个变量计数点击次数来执行不同的函数。

var num=0; 
$('#button').click(function(e){ 
if(num++ %2 == 0){ 
//doSomething 
}else{ 
//doOtherSomething 
} 
e.preventDefault(); //阻止元素的默认动作(如果存在) 
});
Javascript 相关文章推荐
脚本安需导入(装载)的三种模式的对比
Jun 24 Javascript
js 分栏效果实现代码
Aug 29 Javascript
jquery 的 $("#id").html() 无内容的解决方法
Jun 07 Javascript
上传的js验证(图片/文件的扩展名)
Apr 25 Javascript
js实现禁止中文输入的方法
Jan 14 Javascript
深入理解JavaScript系列(50):Function模式(下篇)
Mar 04 Javascript
jquery插件pagination实现无刷新ajax分页
Sep 30 Javascript
JS获取数组最大值、最小值及长度的方法
Nov 24 Javascript
ES6入门教程之Iterator与for...of循环详解
May 17 Javascript
vue组件name的作用小结
May 23 Javascript
vue router 配置路由的方法
Jul 26 Javascript
vue使用nprogress加载路由进度条的方法
Jun 04 Javascript
Jquery获取和修改img的src值的方法
Feb 17 #Javascript
Jquery在指定DIV加载HTML示例代码
Feb 17 #Javascript
javascript 密码框防止用户粘贴和复制的实现代码
Feb 17 #Javascript
javascript 实现子父窗体互相传值的简单实例
Feb 17 #Javascript
javascript 回到顶部效果的实现代码
Feb 17 #Javascript
javascript 获取iframe里页面中元素值的方法
Feb 17 #Javascript
JavaScript省市联动实现代码
Feb 15 #Javascript
You might like
php内核解析:PHP中的哈希表
2014/01/30 PHP
destoon整合UCenter图文教程
2014/06/21 PHP
php rmdir使用递归函数删除非空目录实例详解
2016/10/20 PHP
Js 获取HTML DOM节点元素的方法小结
2009/04/24 Javascript
Javascript基础教程之数据类型 (字符串 String)
2015/01/18 Javascript
jQuery使用hide方法隐藏元素自身用法实例
2015/03/30 Javascript
jquery实现的伪分页效果代码
2015/10/29 Javascript
TinyMCE汉化及本地上传图片功能实例详解
2016/05/31 Javascript
JavaScript字符串对象(string)基本用法示例
2017/01/18 Javascript
BootStrap Datetimepicker 汉化的实现代码
2017/02/10 Javascript
Vue.js之slot深度复制详解
2017/03/10 Javascript
详解Angular Reactive Form 表单验证
2017/07/06 Javascript
解决webpack无法通过IP地址访问localhost的问题
2018/02/22 Javascript
Vue 应用中结合vux使用微信 jssdk的方法
2018/08/28 Javascript
Node.js 实现远程桌面监控的方法步骤
2019/07/02 Javascript
Vue使用鼠标在Canvas上绘制矩形
2020/12/24 Vue.js
[49:17]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第三场 1月26日
2021/03/11 DOTA
Python删除指定目录下过期文件的2个脚本分享
2014/04/10 Python
Python实现带百分比的进度条
2016/06/28 Python
Python代码解决RenderView窗口not found问题
2016/08/28 Python
了解不常见但是实用的Python技巧
2019/05/23 Python
Django集成CAS单点登录的方法示例
2019/06/10 Python
Python面向对象之私有属性和私有方法应用案例分析
2019/12/31 Python
python GUI库图形界面开发之PyQt5表格控件QTableView详细使用方法与实例
2020/03/01 Python
解决Python在导入文件时的FileNotFoundError问题
2020/04/10 Python
Vs Code中8个好用的python 扩展插件
2020/10/12 Python
python 读取yaml文件的两种方法(在unittest中使用)
2020/12/01 Python
澳大利亚制造的蜡烛和扩散器:Glasshouse Fragrances
2018/05/20 全球购物
澳大利亚购买最佳炊具品牌网站:Cookware Brands
2019/02/16 全球购物
行政办公员自我评价分享
2013/12/14 职场文书
农村党支部先进事迹
2014/01/14 职场文书
公务员转正鉴定材料
2014/02/11 职场文书
幼儿园中班教师寄语
2014/04/03 职场文书
文明城市标语
2014/06/16 职场文书
死者家属慰问信
2015/03/24 职场文书
成品仓库管理员岗位职责
2015/04/09 职场文书