切换div的第一个元素的类

这可能是我的简单，但我坚持在这里！切换div的第一个元素的类

代码：

<a href="#" class="icon"> 
    <i class="fa fa-arrow-down"></i> 
    <h6>Heading</h6> 
</a>

点击之后，我想改变FA-箭头向下类FA-向上箭头。我尝试了很多可能性，但没有找到解决方案。请帮家伙...

一个我试图方法是...

$('.icon').click(function() { 
    if ($(this).children(':first').hasClass('fa-arrow-down')) { 
     $(this).children(':first').removeClass('fa-arrow-down').addClass('fa-arrow-up') 
    } 
})

console.log($(this).children())输出：

[i.fa.fa-angle-down, h6, prevObject: n.fn.init[1], context: a.icon] 
0:i.fa.fa-angle-down 
1:h6

感谢

来源

2016-07-22 Himakar

你的输出称 “FA-角度向下”，但你的代码说 “FA-箭头向下” ，所以你在你的代码或者stackoverflow中输入的东西是错误的。 – Bek

它只适用于我，除非你想让它每次点击切换 –

贝克，谢谢！我做错了错误...深夜在IT工作的结果..！ – Himakar

你可以很容易使用做toggleClass()方法如下。

$('.icon').click(function() { 
    $(this).children(':first').toggleClass('fa-arrow-up fa-arrow-down') 
})

来源

2016-07-22 17:49:04 Azim

试试这个..

$('.icon').click(function() { 
if ($(".icon > i").hasClass('fa-arrow-down')) { 
     $(".icon > i").removeClass('fa-arrow-down').addClass('fa-arrow-up') 
    } 
})

来源

2016-07-22 18:02:17

检查了这一点：

$('.icon').click(function() { 

    var hasClass = $('.icon:first-child').hasClass('fa-arrow-down'); 

    if (hasClass) { 
     $('.icon:first-child').removeClass('fa-arrow-down').addClass('fa-arrow-up'); 
    } else { 
     $('.icon:first-child').removeClass('fa-arrow-up').addClass('fa-arrow-down'); 
    } 

});

来源

2016-07-22 18:14:42

切换div的第一个元素的类

回答

相关问题