if/else在jquery添加活动状态到手风琴菜单

Question

我想要的是像添加活动类到手风琴菜单。

我已经写了一个简单的if jquery代码，它肯定不是标准方法，但是如果它可以给我想要的结果，那么适用于我。

但问题是， 在我的手风琴菜单中有主菜单链接，也有子菜单。

这么混乱如何使它正常工作。

这是我的手风琴菜单HTML执行代码。

<ul id="panelbar" data-role="panelbar" class="k-widget k-reset k-header k-panelbar" tabindex="0" role="menu" aria-activedescendant="panelbar_pb_active"> 
    <li class="k-state-active k-item k-first k-state-highlighted" role="menuitem" aria-selected="true" id="panelbar_pb_active"><a href="#home" class="k-link k-header k-state-focused">Home</a></li> 
    <li aria-expanded="false" class="k-item k-state-default" role="menuitem"><span class="k-link k-header"> 
     Search 
     <span class="k-icon k-i-arrow-s k-panelbar-expand"></span></span><ul class="k-group k-panel" role="group" aria-hidden="true" style="display: none;"> 
      <li class="k-item k-state-default k-first" role="menuitem" aria-selected="true" id="panelbar_pb_active"><a href="#PrizeBondSearch" class="k-link k-state-focused">Prize Bond Search</a></li> 
      <li class="k-item k-state-default k-last" role="menuitem"><a href="#SearchUsers" class="k-link">Users</a></li> 
     </ul> 
    </li> 
    <li aria-expanded="false" class="k-item k-state-default k-last" role="menuitem"><span class="k-link k-header"> 
     Profile 
     <span class="k-icon k-i-arrow-s k-panelbar-expand"></span></span><ul class="k-group k-panel" role="group" aria-hidden="true" style="display: none;"> 
      <li class="k-item k-state-default k-first" role="menuitem"><span class="k-link">Update Profile</span></li> 
      <li class="k-item k-state-default k-last" role="menuitem"><span class="k-link">ChangePassword</span></li> 
     </ul> 
    </li> 
</ul> 

这实际上是kendopanelbar，和我使用jQuery的烧烤也，所以尝试这个，因为我想刷新时记住手风琴状态，并且如果一些上打开的链接相应的菜单应突出。

AnyHow，在我的代码中，每当我尝试if语句执行时，我的意思是它不会去别的，即使我改变菜单链接。

这是我的jQuery代码。

//this line is for twitter navbar. 
url && $('ul.nav li').find('a[href="#' + url + '"]').parent().addClass('active'); 

//This is for Kendo accordion menu. 
      var MainMenuLink=$('li.k-item').has('a[href="#' + url + '"]'); 
      var WithSubMenusLink=$('li.k-item').has('ul.k-group').has('li.k-item').has('a[href="#' + url + '"]'); 
      if(url && WithSubMenusLink){ 
       $('ul.k-group').find('a[href="#' + url + '"]').addClass('k-state-selected k-state-focused').parent().attr({ 
        "aria-selected": true, 
        id: 'panelbar_pb_active' 

       }); 
       alert('If is Executing.'); 
      } 
      else{ 
       alert('Else is Executed.'); 
       $('li.k-item').find('a[href="#' + url + '"]').addClass('k-state-selected k-state-focused'); 

      } 

任何想法为什么它只能执行部分以及如何让元素正确手风琴菜单正常工作。

另外我也为twitter navbar做了同样的工作，它的工作非常好。除非我不必为twitter导航栏编写if else。 :)

Answer 1

您可能需要使用

if(url && WithSubMenusLink.length){ 

因为$('li.k-item').has('ul.k-group').has('li.k-item').has('a[href="#' + url + '"]');返回一个jQuery对象，所以WithSubMenusLink永远是truthy。

您需要测试WithSubMenusLink.length以查看选择器查询是否返回任何元素。