大佬教程收集整理的这篇文章主要介绍了jQuery .toggle()显示和隐藏子菜单,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
>父母1
>父母2
>孩子A.
>孩子B.
>家长3
>孩子C.
>孩子D.
我只想在点击其父级时显示子菜单.目前,每当我点击任何父母时,我都会获得所有子菜单.
//SELEct all the `<li>` element that are children of the `.parent` element $('.parent').children().click(function(){ //Now find the `.child` elements that are direct children of the clicked `<li>` and toggle it into or out-of-view $(this).children('.child').slideToggle('slow'); });
演示:http://jsfiddle.net/jasper/z7Zgw/1/
基本上上面的代码使用它来引用点击的< li>因此我们可以找到.child元素,它是被点击的< li>的子元素.元件.
这:$(‘.child’)
更改为:$(this).children(‘.child’)
更新
您也可以停止在嵌套的.child元素上传播click事件,如下所示:
$('.parent').children().click(function(){ $(this).children('.child').slideToggle('slow'); //SELEct all the `.child` elements and stop the propagation of click events on the elements }).children('.child').click(function (event) { event.stopPropagation(); });
演示:http://jsfiddle.net/jasper/z7Zgw/9/
文档:
> event.stopPropagation():http://api.jquery.com/event.stopPropagation
> .children():http://api.jquery.com/children
以上是大佬教程为你收集整理的jQuery .toggle()显示和隐藏子菜单全部内容,希望文章能够帮你解决jQuery .toggle()显示和隐藏子菜单所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。