美文网首页
jQuery toggle事件

jQuery toggle事件

作者: sakatayui酱 | 来源:发表于2017-06-30 23:33 被阅读0次

toggle方法用绑定多个事件处理函数,以响应被选元素的轮流的 click 事件。

该方法也可用于切换被选元素的hide与show方法。

toggle功能在1.9版本之后发生变化了。不再支持多个事件轮流切换。

所以在1.9版本下的绑定toggle点击事件是这样的:

$(selector).toggle(function1(),function2(),functionN(),...)

//////注:必须有2个参数才能切换事件

在1.9之后的版本只好这么写:

//先立个标记,记录点击,根据点击次数来决定行为

let flag=0;

$('button').click(function(){

if(flag++%2==0){

////////do

}

else{

////////do

}

})

这样就可以实现点击事件切换了

切换 Hide() 和 Show()

检查每个元素是否可见。

如果元素已隐藏,则运行 show()。如果元素可见,则元素 hide()。这样就可以创造切换效果。

例子:

$('button').click(function(){

$('p').toggle(1000);

})

显示或隐藏元素

规定是否只显示或只隐藏所有匹配的元素

例:$(selector).toggle(switch)

相关文章

  • jQuery toggle事件

    toggle方法用绑定多个事件处理函数,以响应被选元素的轮流的 click 事件。 该方法也可用于切换被选元素的h...

  • bootstrap中下拉菜单(dropdown)的问题

    通过行间触发事件: 通过jQuery触发事件: 当使用方法去触发时,其中dropdown('toggle')和想象...

  • jQuery基本用法

    所有的CSS选择器都能在jQuery里使用,比如$('[data-toggle^=button]')。 事件绑定 ...

  • jQuery效果总结

    隐藏/显示jQuery hide()和show(): jQuery toggle(): 淡入淡出fadeIn()、...

  • Bug相关

    jquery 相关 使用jq的toggle()、toggleClass() 、hide()、slideUp(),f...

  • js之toggle方法

    toggle方法已经被jquery1.8之后所抛弃,所以我们在用toggle实现元素的隐藏和显示时不能直接用tog...

  • jquery hide() show() toggle()

    对于jquery中的这三个方法 hide()表示隐藏html元素,show()表示显示html元素而toggle(...

  • jquery实现toggle效果

    html代码 js代码 效果

  • jQuery 1.9 中删除的一些方法

    今天在弄jQuery的时候发现toggle方法竟然失效了,然后搜了一下发现原来toggle方法在1.9版本的时候就...

  • jquery实战

    jQuery属性操作 jQuery特殊效果 jQuery动画 jQuery循环 jQuery其他事件 自定义事件

网友评论

      本文标题:jQuery toggle事件

      本文链接:https://www.haomeiwen.com/subject/edwicxtx.html