2012-10-29 74 views
5

此代码无效。 this+'>a'不是有效的语法。 那么,我如何在this的孩子中添加/删除一个班级?在这种情况下,一个a元素。向这个孩子添加班级

jQuery(function ($) { 
     $("nav.menu>ul>li").hover(
      function() { 
       $(this+'>a').addClass("hover_triangle");//error 
      }, 

      function() { 
       $(this+'>a').removeClass("hover_triangle");//error 
      }); 
    }); 

我不能这样做,因为nav.menu>ul>li>a将选择菜单中的所有元素a

回答

10
$(this).children('a').addClass('hover_triangle'); 

,并与全码:

jQuery(function($) { 
    $('nav.menu>ul>li').hover(function() { 
     $(this).children('a').addClass('hover_triangle'); 
    },function() { 
     $(this).children('a').removeClass('hover_triangle'); 
    }); 
}); 
1

$('a', this)让你只看里面的this对象的

jQuery(function ($) { 
    $("nav.menu>ul>li").hover(
     function() { 
      $('a', this).addClass("hover_triangle");//error 
     }, 

     function() { 
      $('a', this).removeClass("hover_triangle");//error 
     }); 
}); 
1

$(this).find('a').addClass('hover_triangle') - 更常见的方式bacause没有必要为直接孩子

0

您可以使用.find()

$(this).find('> a').addClass("hover_triangle"); 

如果你想只选择直接孩子.find('a')将变得更嵌套的锚。要避免这种情况,你需要这样只会访问nav.menu>ul>li

CHECK FIDDLE

直接子元素使用.find('> a').children('a')

0

有2种方法可以搜索this的后代。大多数拥有find()回答(它是更容易阅读),但jQuery选择还可以有第二个arfument这是context

$('a', this)是另一个语法和相同$(this).find('a)。 Internallly jQuery将采取第一种情况和使用find()反正,但语法是有效的,许多使用它

API Refrence: jQuery(selector [, context])