2013-09-13 5 views
2

Просто быстрый вопрос, я хотел бы переключить класс, содержащий «font-size-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') 

    }); 

мне еще нужно настроить несколько вещей, но если вы хотите, чтобы указать что-нибудь идти вперед, я бы рад слышать.

+0

Ваш вопрос не ясно –

+0

Так пользователь нажимает "встроенные кнопки" и переключает класс на .toggleClass элемент? Это то, что вы хотите? – JakeParis

+0

да, переключая вверх и вниз ... У меня есть бета-функция выше .. У меня есть несколько идей, чтобы исправить изломы в вышеприведенном .. снова я открыт для других идей .. –

ответ

3

разметки

<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

+0

Да, у вас это получилось .. Мне было любопытно узнать о '(icon? 'Up': 'down')', используя такой синтаксис .. Я знал, что есть более легкое решение, но для меня в то время было самое чистое метод ...Я не знал, что переключение классов, как и выше, переключается между ними. Это здорово. спасибо .. –

+0

@MichaelJosephAubry Рад, что проблема решена. Приветствия ... –

0

вы могли бы использовать эти два метода:

Значение по умолчанию мб класса вверх или вниз

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

и вы переключая что-то вроде этого:

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

Попробуйте

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

Разве это не то, что я написал выше? –

+0

Я изменил немного проверки, если он работает. –

+0

О, я вижу круглые скобки, я на самом деле добавил это, а потом увидел это ... он работает, но есть небольшая ошибка, которую мне нужно найти. –

Смежные вопросы