Question

只是一个简单的问题，我想切换一个保持“fontawesome-angle”但仍然“向上”和“向下”切换的课程？我试过几种方法：

    $('.build-button').live('click', function(el) {

        var span = $(this).find('span'),
                var icon = //not sure here.. 
                           //I want to toggle between 'up' and 'down'


        span.toggleClass('fontawesome-angle-'+icon ? 'up' : 'down')

});

对不起，我知道这是错的，但我很难过。这应该很容易......

看起来我找到了解决方案：

    $('.build-button').live('click', function(el) {
        var span = $(this).find('span'),
            button = $(this),
            icon = $(this).hasClass('function_on')

        button.addClass('function_on')
        $('#content-builder').toggleClass('opened');
        span.toggleClass('fontawesome-angle-'+icon ? 'up' : 'down')

    });

我仍然需要调整一些事情，但如果你想指出任何事情，我会很高兴听到。

Answer 1

标记

<span class="fontawesome-angle-up">test</span>
<input type="button" value="click" class="build-button"/>

JS

   $(function(){
    $('.build-button').click(function(){
        $('span').toggleClass("fontawesome-angle-up fontawesome-angle-down");
    });
   });

fiddle

Answer 2

你可以使用这两种方法：

默认类mb向上或向下

<span class="fontawesome-angle-up" ></span>

你切换这样的东西：

span.toggleClass('fontawesome-angle-up');
span.toggleClass('fontawesome-angle-down');

Answer 3

尝试

 $('.build-button').live('click', function (el) {
     var span = $(this).find('span'),
         button = $(this),
         icon = $(this).hasClass('function_on');

     button.addClass('function_on');
     $('#content-builder').toggleClass('opened');
     span.toggleClass('fontawesome-angle-up').toggleClass('fontawesome-angle-down');

 });

或者

span.toggleClass('fontawesome-angle-'+(icon ?'up':'down'))

使用变量切换类？

3 个答案: