如果下一个ul是隐藏的,想要显示下一个ul
If next ul is hidden want to show next ul
>我需要检查嵌套无序列表中的下一个ul是否可见,如果没有,则显示该ul。
我正在使用:
$('#treemenu1 li a').on('click', function(e) {
next("ul").is(':hidden').show(300);
$('#treemenu1 li a').next("ul").is(':visible').hide(300);
});
该目录
<ul id="treemenu1" class="treeview">
<li><a href="#0">Start</a></li>
<li><a href="#1">Are your team:</a></li>
<li class="submenu" id="expandable"><a href="#2">Stakeholder Zen</a>
<ul class="menu">
<li><a href="#3">What is a Stakeholder?</a></li>
<li><a href="#4">Why manage stakeholders?</a></li>
</ul>
</li>
<li class="submenu"><a href="#6">Managing your stakeholders</a>
<ul class="menu">
<li><a href="#7">Use four simple steps</a></li>
<li class="submenu"><a href="#8">Identify your stakeholders</a>
<ul class="menu">
<li><a href="#9">Identification techniques</a></li>
<li><a href="#10">Identification tools</a></li>
</ul>
</li>
</ul>
你使用是错误的。 is
返回 true 或 false,因此您需要将其包装在 if 块中。
你的第一个next
是错误的
$('#treemenu1 li a').on('click', function(e) {
var $ul = $(this).next("ul");
if ($ul.is(':hidden'))
{
($ul.show(300);
}
var $ul2 = $('#treemenu1 li a').next("ul");
if ($ul2.is(':visible'))
{
$ul2.hide(300);
}
});
或者更好的是,您无需检查它是否已显示:
$('#treemenu1 li a').on('click', function(e) {
$(this).next("ul").show(300);
$('#treemenu1 li a').next("ul").hide(300);
});
甚至更好(现在您已经创建了一个小提琴来显示您希望它做什么(:
$('#treemenu1 li a').click(function(e) {
$(this).next("ul").toggle(300);
});
尝试
var $as = $('#treemenu1 li a').on('click', function(e) {
var $next = $(this).next("ul").toggle(300);
$as.next("ul:visible").not($next).hide(300);
});
演示:小提琴
或
var $as = $('#treemenu1 li a').on('click', function(e) {
var $next = $(this).next("ul");
$next.filter(':hidden').stop(true, true).show(300);
$as.next("ul:visible").not($next).stop(true, true).hide(300);
});
演示:小提琴
试试这个
$(document).ready(function(){
$('#treemenu1 li a').click(function(e) {
$('#treemenu1 li a').next("ul:visible").hide(300);
$(this).next("ul:hidden").show(300);
});
});
JSFIDDLE 演示
相关文章:
- 滚动到容器中的下一个元素-几乎到了
- 后焦点更改为IE 11中的地址栏,而不是转移到表单中的下一个控件
- 使用CSS或js,使用动态选择器选择任意li的下一个元素
- 使用ajax将数据从一个步骤发送到下一个步骤的3步表单
- AngularJS&JSON-从Previous&下一个对象
- 使用向下箭头键(与tab键一样)聚焦下一个输入
- 来自文档或下一个静态父级的事件委派
- angularjs移除焦点上的活动类并添加到下一个项目
- 禁用旋转木马中的下一个按钮和上一个按钮
- 当按下一个键时,请多次按下不同的键
- 正在加载下一个帖子
- 构建JS测试,警报窗口重复上一个Q,而不是问下一个Q
- 删除“;上一个“;以及“;下一个“;基于当前幻灯片
- 真正的下一个具有特定类的元素
- 如何使用javascript获取下一个/转发url
- 悬停显示下一个“ul”的“李”
- 如果下一个ul是隐藏的,想要显示下一个ul
- 如何瞄准下一个<ul>在<ul>使用jquery
- 使用jQuery从H3向下滑动下一个UL
- 动态链接到ul树的下一个同级