jQuery活动页面链接 [英] Jquery Active page link

问题描述

需要有关此代码的帮助，我已经下线了

Need some help with this code I got off the net

$(document).ready(function(){
jQuery(".linkbar li").each(function(){
var href = jQuery(this).find('a').attr('href');
if (href === window.location.pathname) {
$(this).addClass('current');
}
});
});

如果我愿意 document.write(href);

if I do document.write(href);

我得到未定义"

如果将var href = jQuery(this).find('a').attr('href');放在.each()函数之前，它将更改我到当前类的所有链接

If I place var href = jQuery(this).find('a').attr('href'); before .each() function it changes all my links to the current class

下面是我的HTML和CSS 我需要更改当前页面的css链接，我对Jquery/JS不太满意.请向我解释问题出在哪里以及如何解决.

below is my HTML and CSS I need to change the css link for the current page, I'm not too good with Jquery/JS. Please explain to me what the problem is and how to solve it.

<div class ="linkbar">

<a href = "/HTS/about-us.php"><li> ABOUT US </li> </a>
<a href = "service.php"><li> SERVICES </li> </a>
<a href = "download.php"><li> DOWNLOAD </li> </a>
</div>

CSS

.linkbar li{
text-decoration:none;
float:left;
list-style-type: none;
font-size:11px;
width:auto;
padding:9px 18px 9px 18px;
}

.current{
background-color:#fecd0f;
vertical-align:center;
color:#fff;
}

推荐答案

好吧，伙计，您有.find()在元素内部找到的内容，并且将标签锚定为li标签的父标签，所以请不要使用它: >

well, buddy you have .find() which finds inside the element and you anchor tag as parent of li tag so instead of that use this:

var href = $(this).parent('a').attr('href');

如果是这个，那么您拥有这个:

if it was this you have this:

<li><a href = "/HTS/about-us.php"> ABOUT US  </a></li>
<li><a href = "service.php"> SERVICES </a></li>
<li><a href = "download.php"> DOWNLOAD  </a></li>

仍然从不使用find()，而是使用此:

still never use find() but use this :

var href = $(this).children('a').attr('href');

这篇关于jQuery活动页面链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！