2013-08-20 2 views
1

Ищете некоторую помощь с некоторым jQuery, я хочу добавить класс к первому UL под тегом Nav, и я хочу добавить другой класс для каждого li, который является родительским к UL.Добавление классов в мою панель навигации

Код для панели навигации ниже. Также мой текущий код jQuery, который, похоже, не работает.

Я должен добавить их в jQuery из-за платформы, для которой я разрабатываю.

Заранее спасибо за помощь Джордж

<nav class="uk-navbar" id="navBarNav"> 
<ul ADD CLASS HERE> 
    <li class="uk-active"><a href="index.html" rel="self" id="current">Home</a></li> 
    <li ADD CLASS HERE><a href="page1/index.html" rel="self">page2</a> 
     <ul> 
      <li><a href="page1/page4/index.html" rel="self">sub1</a></li> 
      <li><a href="page1/page5/index.html" rel="self">sub2</a></li> 
     </ul> 
    </li> 
    <li><a href="page2/index.html" rel="self">page3</a></li> 
    <li><a href="page3/index.html" rel="self">page4</a></li> 
</ul> 

$('#navBarNav ul').addClass('uk-navbar-nav'); 
$('#navBarNav ul li').has(ul).addClass('uk-pearent'); 
+0

Является ли ваш код внутри document.ready (...) - это дом готов быть запрошены? – andrewb

+0

Вводит ли строка '$ ('# navBarNav ul')' в консоль JavaScript элемент, который вы пытаетесь внести? Возможно, селектор каким-то образом не находит элемент вообще. Одной из причин может быть DOM, не будучи готовым. –

+0

Ну идиот ночной награды приходит ко мне, забыл связать JS-файл с HTML-документом ..... –

ответ

0

Проблема с этой линии

$('#navBarNav ul').addClass('uk-navbar-nav'); 

Это добавляет класс к обоим ULS , Попробуйте

$('#navBarNav ul:first').addClass('uk-navbar-nav'); 
2

Попробуйте

$('#navBarNav ul').addClass('uk-navbar-nav'); 
    $('#navBarNav ul li ul').removeClass('uk-navbar-nav').addClass('uk-pearent'); 

Demo

1
$('#navBarNav').children('ul').first().addClass('uk-navbar-nav'); 

и

$('#navBarNav').find('ul').closest('li').addClass('uk-pearent'); 
0

один трюк я нормально сделать, это создать имя класса, который является достаточно уникальным для каждого из li под ul, то u se JQuery, чтобы захватить класс и с помощью цикла for, чтобы добавить дополнительный класс к этим li. вот какой-то код pseduo.

<ul> 
    <li class="unique_class"> Your content</li> 
    <li class="unique_class">Your content </li> 
</ul> 

в разделе сценария

var contents = $(".unique_class") 
for (i=0; i<contents.length; i++) 
{ 
    contents[i].addClass('the class you want to add') 
} 
Смежные вопросы