jquery：删除父列表项的href属性

Question

我有一个菜单组成的<ul> coupde s嵌套在几个<li> s。例如：

<ul> 
<li><a href="somewhere.html">Item 1</a></li> 
<li><a href="somewhere.html">Item 2</a></li> 
<li><a href="somewhere.html">Item 3</a> 
    <ul> 
    <li><a href="somewhere.html">Sub Item 1</a></li> 
    <li><a href="somewhere.html">Sub Item 2</a></li> 
    </ul> 
</li> 
</ul> 

为<li> s的嵌套<ul>正是我想要用＃替换他们href属性，如：

<li><a href="somewhere.html">Item 2</a></li> 
<li><a href="#">Item 3</a> 
     <ul> 
     <li><a href="somewhere.html">Sub Item 1</a></li> 

我写了这个脚本来做到这一点，但它似乎影响所有这两个列表中的标签。

$.each($("#menu ul li"), function() { 
    if($(this).has("ul")){ 
    $(this).find("a").attr("href", "#"); 
    }; 
}); 

想知道是否有人能告诉我我哪里出错了吗？

Answer 1

检查dom是否有像下面的孩子。

$(this).children('ul').length

在你的代码，其内部如果条件你在哪里使用检查.has

测试工作守则

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript"> 

    $(function() 
    { 
     $.each($("#menu ul li"), function() 
     { 
      if($(this).children('ul').length > 0) 
      { 
       $(this).find("a").attr("href", "#"); 
      }; 
     }); 
    }); 

</script> 

<ul> 
    <li><a href="somewhere.html">Item 1</a></li> 
    <li><a href="somewhere.html">Item 2</a></li> 
    <li><a href="somewhere.html">Item 3</a> 
     <ul> 
     <li><a href="somewhere.html">Sub Item 1</a></li> 
     <li><a href="somewhere.html">Sub Item 2</a></li> 
     </ul> 
    </li> 
</ul>

Answer 2

查找嵌套的<ul>元素，导航到其父代<li>，选择内部的<a>，并更改href。

$('li > ul').parent().children('a').attr('href', '#'); 

---

至于为什么你的代码不能正常工作，这是由于两个主要的问题。首先， find遍历所有级别的后代。你实际上想要做的只是遍历第一级的后代，所以使用 children。其次， has（非直观地）不返回布尔值，它只是将匹配的集合过滤为必要的元素（因此在 if中使用它是毫无意义的，因为任何非空对象的计算结果为true）。当纠正，你的代码将改为：

$("#menu ul li").has("ul").children("a").attr("href", "#"); 

这些方法的执行会做你需要什么，但第二个更简单，所以可能会产生更好的性能。

Answer 3

这将是罚款：http://jsfiddle.net/H8JDy/

$('#menu ul li > ul').siblings('a').attr('href', '#'); // <---this does the trick 

一s评论于nbrooksthere's no reason for it to be wrapped in the loop