используя содержимое тега <a>для установки класса li с помощью jquery - PullRequest
0 голосов
/ 24 января 2010

У меня есть простое выпадающее меню:

<ul id="nav" >
<li><a href='/'>Parent One</a>
<ul>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
</ul>
</li>
<li><a href='/'>Parent Two</a>
<ul>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
</ul>
</li>

Мне нужно назначить класс для тега

родительского элемента, который совпадает с именем родителя в теге .
<ul id="nav" >
<li class="ParentOne"><a href='/'>ParentOne</a>
<ul>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
</ul>
</li>
<li class="ParentTwo"><a href='/'>ParentTwo</a>
<ul>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
<li><a href='/'>child</a></li>
</ul>
</li>

Я попробовал этот бит кода:

    <script language="javascript" type="text/javascript">
 $('#navigation ul li a').each(function(index) {
 var link = $(this);
 $('li', link.parent()).addClass(link.text());
 });
 </script>

Но это относится к классу для детского тега

, а не к родительскому - любая помощь будет принята с благодарностью. Спасибо!

Ответы [ 4 ]

3 голосов
/ 24 января 2010
$('#nav > li > a').each(function(){
    $(this).parent().addClass($(this).text().replace(/\s/, ''));
});
1 голос
/ 24 января 2010

Это должно сделать это:

$(document).ready(function() {
    $('#nav > li > a').each(function(index) {
        $(this).parent().addClass($(this).text());
    });
});

Это также действует только на элементы li верхнего уровня; в случае, если вы добавляете классы к другим более глубоким вложенным элементам.

1 голос
/ 24 января 2010

попробуйте это:

$(document).ready(function(){
    $('#nav>li>a').each(function(){
        $(this).parent().addClass($(this).text().replace(/\s/,''))
    });
});

:)

РЕДАКТИРОВАТЬ: Не думая ... о боже ... отремонтировано:)

РЕДАКТИРОВАТЬ 2: Добавлено обрезка пробелов.

РЕДАКТИРОВАНИЕ 3: Отредактировано, добавлено $ document.ready, 100% работа с обрезкой пробелов;)

0 голосов
/ 24 января 2010

Это сработало:

$("#nav li").each(function() { 
  $(this).addClass($(this).children("a").text());
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...