jquery显示元素是否具有类和特定值的内容
jquery showing content if an element has a class and specific value
我正在创建一个导航栏,只有当元素的类为"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 ');
}
试试这个:
if($('.navbar-nav li').attr(class).indexOf('active')!=-1 && $('.navbar-nav li a').val() === "Home"){
$('.navbar-nav li.active a').prepend('test ');
}
$('.navbar-nav li.active a:contains(Home)').prepend('test ');
如果选择器与任何元素都不匹配,则不会发生任何事情。
相关文章:
- 在JavaScript中,如何修复元素显示和变量创建之间的初始差异
- 使用漂亮的照片点击另一个元素显示图像
- 我将如何在 HTML 中将数组中的所有元素显示为可点击的对象
- 使元素显示在最小屏幕大小上
- 更好的做法是通过CSS类或直接(通过DOM)修改HTML元素显示
- 如何在YouTube视频前制作元素显示
- 使隐藏元素显示 X 秒
- 如果元素显示:无;在媒体查询中,它们是否仍然加载
- 无法为每个元素显示高图
- 如何使用 jQuery 逐个元素显示
- 使用 jQuery 画布元素显示 Hiddin Div
- '李'mouseover事件被child'a'元素显示块
- JQuery元素显示/隐藏和控制流
- D3在工具提示上将内部列表的元素显示为不同的行
- AngularJS-动态创建<text区域>使用ngSanitize不会't显示(其他元素显示)
- 如何根据单击的元素的位置使元素显示在右侧或左侧
- 响应元素显示:无;在移动宽度,然后通过javascript按钮返回,但显示的链接断开:block;
- 当我再次单击时,它显示none,高度回到0px,但里面的元素显示,不显示none或离开页面
- 将一个元素显示在另一个元素的顶部,并在其上禁用鼠标悬停事件
- reactjs:为什么在render中定义的一些dom元素显示两次