Question

我正在使用jQuery将addClass添加到类 mitem 的最近的href。

但它不起作用......

问题是，使用这样的代码，它会将 act 类添加到菜单中的所有 a 元素，而不仅仅是最接近的 a 元素。

也许我应该用别的东西？或者我编写代码的方式可能有问题？

<script type="text/javascript">
$(document).ready(function(){ 
$("#nav").hover(function(){ 
    //$('ul li.current').addClass('act');
    $(this).closest("a.mitem").addClass("act");
  }, 
  function () {
     $(".mitem").removeClass('act');
  }
  );    

});
</script>

        <ul id="nav">
            <li><a href="#" class="mitem mhome" title="">home</a></li>
            <li><a href="#" class="mitem mshop" title="">shop</a>
                <ul class="child">
                    <li class="mheader"></li>
                    <li><a href="#">Hard Drives</a></li>
                    <li><a href="#">Monitors</a></li>
                    <li><a href="#">Speakers</a></li>
                    <li><a href="#">Random Equipment</a></li>
                </ul>            
            </li>
         </ul>

Answer 1

您将悬停事件附加到整个ul元素#nav，因此即使您使用实际的jQuery方法遍历find()或{{1}，最近的锚也始终是第一个}}

假设您希望锚标记在父元素悬停时添加类，您可以这样做：

children()

Answer 2

尝试选择this下与您的选择器匹配的第一个后代：

$(this).find('a.mitem').first()

DEMO

Answer 3

其他人发布了答案然后因某种原因删除了它，但它是唯一一个为我工作的人，所以这里是：

$("#nav li").has("ul").hover(function(){
    $(this).addClass("current").children("ul").fadeIn();
    $(this).children("a.mitem:first").addClass("act");

}, function() {
    $(this).removeClass("current").children("ul").hide();
    $(this).children("a.mitem:first").removeClass("act");

});

将类添加到最近的href

3 个答案: