Question

我的代码：http://codepen.io/anon/pen/ABrDe

当我点击'li'中的'a'元素时，我想让它获得'主动'类和右边的箭头（我写入JS部分的'span'）。 “活跃”部分没问题，但我对箭头部分感到困惑。我想我应该选择'li'，而不是'a'。但我只把“主动”课程给'a'。如何选择“'''谁是'a'的父级，其中'a'类具有'活跃'？”

Answer 1

jQuery选择器：

$("a").parent("li").hasClass("active");

Answer 2

使用parent方法。

$("#resp-list a").click(function () {
     var _this=$(this);
     var parentItem=_this.parent();

    //do whatever you want with the parent.
});

此外，您可能需要使用append方法将范围添加到li。

Answer 3

使用以下命令检索父对象

var parent = $(this).parent();

因此，在您的情况下，父jQuery对象将保留以下DOM：

<li>
    <a href="#">Test ...</a>
</li>

同样，在范围内将jQuery包装在对象中一直是一个好主意。因此，当您多次使用选择器时，请将其保存到变量中。

var $this = $(this);
var $parent = $this.parent();

Answer 4

请参阅：Fiddle

 $("#resp-list a").click(function () {
     $(this).parent().siblings().find('a').removeClass("active");
     $(this).addClass("active"); 
     $(this).parent().add('<span class="fr arrow-right"></span>');
 });

Answer 5

我编辑你的小提琴，表现得像你期望的那样。

http://cdpn.io/ABrDe

    $("#resp-list > li").on('click', 'a', function () {
        $("#resp-list > li > a").removeClass('active');
        $(this).addClass("active"); 
        $(this).parent().prepend('<span class="fr arrow-right"></span>');
   });

Answer 6

看看这个......

http://jsfiddle.net/qdZxQ/

（文档）$。就绪（函数（）{ $（“＃resp-list a”）。click（function（）{

    $("#resp-list a").removeClass("active");
    $(this).addClass("active"); 
    if($(this).hasClass("active")){
        $("#resp-list a span").remove();
        $(this).append('<span class="fr arrow-right"></span>');
    }
 });

}）;

希望这是你所期待的。

使用jQuery从其子元素中选择父元素

6 个答案: