jquery - 使用变量切换类？

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");
    });
   });

小提琴

Answer 2

尝试

 $('.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'))

Answer 3

你可以使用这两种方法：

默认类 mb up 或 down

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

你切换这样的东西：

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