成都网站建设设计

将想法与焦点和您一起共享

jquery如何实现点击显示元素再次点击隐藏元素

这篇文章主要讲解了“jquery如何实现点击显示元素再次点击隐藏元素”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“jquery如何实现点击显示元素再次点击隐藏元素”吧!

成都做网站、网站制作的关注点不是能为您做些什么网站,而是怎么做网站,有没有做好网站,给创新互联一个展示的机会来证明自己,这并不会花费您太多时间,或许会给您带来新的灵感和惊喜。面向用户友好,注重用户体验,一切以用户为中心。

方法:1、用click()方法给按钮绑定点击事件并指定处理函数;2、在函数中用if语句、show()和hide()实现,语法“if(元素对象.is(':hidden')){元素对象.show();}else{元素对象.hide();}”。

本教程操作环境:windows7系统、jquery1.10.0版本、Dell G3电脑。

jquery怎样实现点击显示元素再次点击隐藏元素

在jquery中,可以通过show()方法和hide()方法来实现点击按钮显示再次点击隐藏,hide()方法如果被选的元素已被显示,则隐藏该元素。语法为:

$(selector).hide(speed,callback)

show()方法如果被选元素已被隐藏,则显示这些元素,语法为:

$(selector).show(speed,callback)

下面我们通过示例来看一下怎样实现县级显示再次点击隐藏,示例如下:







div{width:100px;
height:100px;
background: red;
}

显示与隐藏

输出结果:

jquery如何实现点击显示元素再次点击隐藏元素

感谢各位的阅读,以上就是“jquery如何实现点击显示元素再次点击隐藏元素”的内容了,经过本文的学习后,相信大家对jquery如何实现点击显示元素再次点击隐藏元素这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是创新互联,小编将为大家推送更多相关知识点的文章,欢迎关注!


网站栏目:jquery如何实现点击显示元素再次点击隐藏元素
文章来源:http://chengdu.cdxwcx.cn/article/gchjdc.html

其他资讯