Я создаю панель навигации и хотел бы добавить значок рядом с каждым элементом, только если элемент имеет класс "active"
а значение элемента равно строке.
http://gyazo.com/4811bc6779aaecd1fe80c020a69f1fb6.png
Итак, у меня есть значки рядом с элементами уже, я не хочу, чтобы они были видимыми, пока у них не будет активного класса, такого как Home
. Я попробовал это:
if($('.navbar-nav li').hasClass('active') && $('.navbar-nav li a').val() === "Home"){
$('.navbar-nav li.active a').prepend('test ');
}
но это не сработало. У меня есть разные значки для каждого элемента, поэтому я предполагаю elseif
для каждого случая.
Разметка для навигации (отображается с помощью PHP):
<?php
$nav = array(
'Home' => 'index.php',
'<span class="icon-bubbles"></span> Forums' => '#',
'<span class="icon-cabinet"></span> Gametypes' => 'index.php?action=gamemodes',
'<span class="icon-aid"></span> Help' => 'index.php?action=help',
'Statistics' => 'index.php?action=statistics'
);
?>
<ul class="nav navbar-nav">
<?php
$request = basename($_SERVER['REQUEST_URI']);
foreach($nav as $name => $link):
?>
<li <?php if($request == $link) echo 'class="active"'; ?>><a href="<?php echo $link; ?>"><?php echo $name ?></a></li>
<?php
endforeach;
?>
<li>
<a href="http://google.com" title="Thanks for voting!" rel="shadowbox[vote];width=1000px;"><span class="icon-pencil"></span> Minecraft Voting</a>
<div style="display:none;">
<a href="http://google.com" title="Thanks for voting!" rel="shadowbox[vote];width=1000px;"></a>
</div>
</li>
</ul>
.val()
не будет работать. Он работает с типами ввода. Использовать .text()
Пытаться:
if($('.navbar-nav li').hasClass('active') && $('.navbar-nav li a').text() === "Home"){
$('.navbar-nav li.active a').prepend('test ');
}
$('.navbar-nav li.active a:contains(Home)').prepend('test ');
если селектор не соответствует каким-либо элементам, ничего не происходит.
Попробуй это:
if($('.navbar-nav li').attr(class).indexOf('active')!=-1 && $('.navbar-nav li a').val() === "Home"){
$('.navbar-nav li.active a').prepend('test ');
}