如何根据多级菜单替换菜单属性

时间:2014-04-03 15:46:51

标签: jquery

嗨,我有这个菜单结构。

  <ul>
    <li>
      <a href="/link">Item 1</a>
      <ul>
        <li>
          <a href="/link">Sub 1.1</a>
          <ul>
            <li><a href="/link">Sub 1.1.1</a></li>
            <li><a href="/link">Sub 1.1.2</a></li>
          </ul>
        </li>
        <li><a href="/link">Sub 1.2</a></li>
      </ul>
    </li>
    <li>
      <a href="/link">Item 2</a>
      <ul>
        <li><a href="/link">Sub 2.1</a></li>
        <li><a href="/link">Sub 2.2</a></li>
      </ul>
    </li>
    <li><a href="/link">Item 2</a></li>
  </ul>

我希望转换一些&lt; a&gt; tag的href为'#',如下所示:

  <ul>
    <li>
      <a href="#">Item 1</a>
      <ul>
        <li>
          <a href="#">Sub 1.1</a>
          <ul>
            <li><a href="/link">Sub 1.1.1</a></li>
            <li><a href="/link">Sub 1.1.2</a></li>
          </ul>
        </li>
        <li><a href="/link">Sub 1.2</a></li>
      </ul>
    </li>
    <li>
      <a href="#">Item 2</a>
      <ul>
        <li><a href="/link">Sub 2.1</a></li>
        <li><a href="/link">Sub 2.2</a></li>
      </ul>
    </li>
    <li><a href="/link">Item 2</a></li>
  </ul>  

我正在尝试使用以下jquery来实现但未能成功,有人可以帮助弄清楚。感谢。

if ( $('ul li a').next().is('ul') ){

   $(this).attr('href','#');
}

我的逻辑基本上是 IF&lt; a&gt;下一个兄弟是&lt; ul&gt;然后替换这个&lt; a&gt;使用“#”属性href 这样我就可以保留那些没有子节点或者自己的最后一个菜单元素的链接。

1 个答案:

答案 0 :(得分:1)

您要找的是filter

$('ul li a').filter(function(){
    return $(this).next('ul').length;
}).attr('href', '#');