определение заголовка в качестве тега в JQuery UI Accordian

Question

увидеть следующее

js fiddle

Я в Accordian с заголовком определяется как a.viewLabel. Моя цель - создать еще один класс, который будет ссылаться на внешнюю страницу. Но вы увидите в скрипке, что определение заголовка вызывает аккордеон странно себя вести

$("#main-nav").accordion({ 
    autoHeight: false, 
    collapsible: true, 
    active: false, 
    header: 'a.viewLabel' 
}); 

Answer 1

Внутренний аккордеон рассматриваются как часть оригинального аккордеона, поскольку селектор находит все элементы, которые соответствуют вашему селектору, независимо от того, где они находятся внутри дерева DOM элемента, который вы создаете.

Я бы предложил отделить внутренний аккордеон от разных классов и создать новый аккордеон внутри.

Here's an example.

HTML:

<ul id="main-nav"> 
    <li><a href="" class="viewLabel">item one</a> 
     <ul id="new"> 
      <li><a href="" class="viewLabel1">item one</a></li> 
      <li><a href="" class="viewLabel1">item one</a></li> 
      <li><a href="" class="viewLabel1">item one</a></li> 
     </ul> 
    </li> 
    <li><a href="" class="viewLabel">item one</a></li> 
    <li><a href="" class="viewLabel">item one</a></li> 
</ul> 

JS:

$("#main-nav").accordion({ 
    autoHeight: false, 
    collapsible: true, 
    active: false, 
    header: 'a.viewLabel' 
}); 

$("#new").accordion({ 
    autoHeight: false, 
    collapsible: true, 
    active: false, 
    header: 'a.viewLabel1' 
});