Jquery removeClass，addClass

Question

我遇到了带有removeClass和addClass函数的问题。我打算在单击下拉列表时更改字体真棒类。我已多次尝试过这项工作，但我认为我必须忽略一些事情。

这是我的HTML代码：

<div id="cssmenu"class="col-xs-12 left">
    <ul class="nav nav-sidebar">
       <li><a href='#'><span>Dashboard</span></a></li>
       <li class='active has-sub'><a href='#'><span>Products</span><i class="fa fa-caret-right"></i>

这是我的Jquery代码，我试图删除该类并添加另一个：

$('#cssmenu ul li a i').on('click', function() {
    $('#cssmenu ul li a i').removeClass('fa-caret-right');
    $(this).addClass('fa-caret-down');
});

感谢您一看:)顺便说一句，我正在寻找线索，而不是答案，因为我正在努力学习Jquery。

Answer 1

您在元素click上使用<i>，显然您没有点击。尝试在主播click标记上使用<a>并更改其中包含的<i>上的类。

Answer 2

我会在列表项上添加click事件：

$('#cssmenu ul li').on('click', function() {
        $('#cssmenu ul li a i').removeClass('fa-caret-right');
        $(this).find('i').addClass('fa-caret-down');
});

Answer 3

$('#cssmenu ul li a').on('click', function() {
        $('#cssmenu ul li a i').removeClass('fa-caret-right');
        $(this).find('i').addClass('fa-caret-down');
});

Answer 4

试试这个

$('#cssmenu ul li a i').on('click', function() {
        $(this).addClass('fa-caret-down').siblings().removeClass('fa-caret-right');
});

Answer 5

试试这个解决方案：

$('#cssmenu ul li.has-sub').on('click', function() {
  $(this).find('i').removeClass('fa-caret-right').addClass('fa-caret-down');
});

Answer 6

至于你提到的线索，你可能想看看jQuery的toggleClass（）方法： http://api.jquery.com/toggleclass/