JavaScript开发toggle()隐藏问题的解决方法
最近编写一个实例的时候使用到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(); //阻止元素的默认动作(如果存在)
});
推荐阅读
-
Bootstrap开发中Tab标签页切换图表显示问题的解决方法
-
JavaScript开发toggle()隐藏问题的解决方法
-
Android开发 RadioButton使用中遇到的问题与解决方法
-
小程序开发过程中的遇到的问题以及解决方法(1)
-
PHP开发中常见的安全问题详解和解决方法(如Sql注入、CSRF、Xss、CC等)
-
UTF8编码开发中页面空白问题的解决方法
-
POI导出,开发中经常会遇到数据导出这样的问题,下面是我在开发中采用的解决方法,大家可以参考,具体的实现害的结合你自身的业务逻辑
-
javascript预览上传图片发现的问题的解决方法
-
页面元素绑定jquery toggle后元素隐藏的解决方法
-
记录Yii2框架开发微信公众号遇到的问题及解决方法