Увеличение/уменьшение индикатора выполнения

Мне нужна помощь с индикатором выполнения из semantic UI. Я пытаюсь воспроизвести первый пример с помощью кнопки увеличения/уменьшения, но для меня жизнь не может заставить его работать, любая помощь в этом вопросе или пример с кодом Javascript будут очень признательны.


person Sebastien Deschamps    schedule 19.06.2015    source источник
comment
нет необходимости указывать [решено] в заголовке, ваше согласие с ответом показывает, что на вопрос был дан ответ. :)   -  person Tony    schedule 23.06.2015
comment
Упс, спасибо Тони ;)   -  person Sebastien Deschamps    schedule 24.06.2015


Ответы (1)


Код этой страницы находится здесь, и вы просматриваете, в частности, этот раздел:

$buttons
  .on('click', function() {
    var
      $progress = $(this).closest('.example').find('.ui.progress')
    ;
    if( $(this).hasClass('increment') ) {
      $progress.progress('increment');
    }
    else {
      $progress.progress('decrement');
    }
  })
;

Как видите, к каждой кнопке добавляется событие click. Затем $progress назначается ближайшему найденному индикатору выполнения. Наконец, мы проверяем класс кнопки (чтобы узнать, является ли она инкрементной или декрементной), и значение .progress используется соответствующим образом.

Пока мы этим занимаемся, вот HTML, который они используют для кнопок:

<div class="example">
  <div class="ui progress">
    <div class="bar">
      <div class="progress"></div>
    </div>
  </div>
  <div class="ui icon buttons">
    <div class="decrement ui basic red button"><i class="minus icon"></i></div>
    <div class="increment ui basic green button"><i class="plus icon"></i></div>
  </div>
</div>
person Moustach    schedule 21.06.2015
comment
Спасибо, Усатый, твой пост мне очень помог с моим мозгом ;) Наконец-то у меня все заработало !!!! да, только что добавил var semantic=$(this), чтобы не было таких ошибок, как ReferenceError: semantic не определено, и все проверил, еще раз спасибо ;) - person Sebastien Deschamps; 23.06.2015