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