1

我正在研究一个下拉菜单，并希望有选择地更改某些元素的 href 属性。菜单由两个类组成，菜单项和子菜单项。每个菜单项都有一个相应的子菜单，但有些子菜单包含空列表。对于具有空子菜单列表的菜单项，我希望 href 为“#”。

<div id="info" class="menuitem"><a href="http://www.asmithspace.net">Info</a><!--start menuitem-->
<div id="infosubmenu" class="submenu"><!--start submenu-->
<ul>
<li><a href="#">Item1</a></li>
<li><a href="#">Item2</a></li>
<li><a href="#">Item3</a></li>
</ul>
</div><!--end submenu-->
</div><!--end menuitem-->
<div id="business" class="menuitem"><a href="http://www.asmithspace.net">Business</a><!--start menuitem-->
<div id="businesssubmenu" class="submenu"><!--start submenu-->
<ul>
<li><a href="#">Item1</a></li>
<li><a href="#">Item2</a></li>
</ul>
</div><!--end submenu-->
</div><!--end menuitem-->
<div id="jobs" class="menuitem"><a href="http://www.asmithspace.net">Jobs</a><!--start menuitem-->
<div id="jobssubmenu" class="submenu">
<ul>
</ul>
</div><!--end submenu-->
</div><!--end menuitem-->

我已经使用 $.each 循环和常规 javascript 尝试了此代码的不同变体，但我所做的一切要么将所有 menuitem href 更改为“#”，要么不更改其中任何一个。

if (!$('.menuitem').children('.submenu').children('ul').children('li').length > 0) {
$('.menuitem').children('a').attr('href', '#'); }

如果有人能告诉我我做错了什么，我会非常感激！我的测试页可以在这里找到。

4

2 回答 2

2 
$(".menuitem > a").each(function () {
  if ($(this).next('.submenu').find('li').length > 0)
    $(this).attr("href","#");
});

演示

于 2013-01-15T16:05:25.557 回答
0

我想这就是你要找的：

$('.menuitem')
  .children('.submenu')
  .each(function(index) {
    if($(this).children('ul').children('li').length === 0) {
      $(this).closest('.menuitem').children('a').attr('href', '#');
    }
  });

对于每个子菜单，它都会检查数组的长度ul > li，如果它是 0，我会更改最近的父菜单项中链接的 href。

于 2013-01-15T16:06:19.613 回答