2

Столкнулся с проблемой(вопросом).
У меня достаточно простое действие при нажатии на элемент:

$(document).on('click', '.add-plus-btn.transition_1', function() {
  $(this).fadeOut(0);
  $('.add-transition.transition_1').fadeIn(250);
});
$(document).on('click', '.add-plus-btn.transition_2', function() {
  $(this).fadeOut(0);
  $('.add-transition.transition_2').fadeIn(250);
});

// И так до transition_60 элементов (может быть по разному);

Как мне упростить код, возможно циклом for? Но никак не получается...
Спасибо!

7
  • перенести этот класс в дата атрибут и сделать один обработчик
    – Grundy
    Commented 21 окт. 2016 в 15:27
  • зачем цикл, если можно повесить обработчик на .add-plus-btn и внутри использовать this? Правда странно как-то fadeOut и сразу fadeIn на том же элементе Commented 21 окт. 2016 в 15:28
  • @АлексейШиманский, как ты будешь определять, какой из классов transition_* присутствует у this, если у него из несколько
    – Grundy
    Commented 21 окт. 2016 в 15:30
  • @АлексейШиманский - это разные элементы
    – user176262
    Commented 21 окт. 2016 в 15:31
  • @Igor ясненько. вижу. Commented 21 окт. 2016 в 15:31

1 ответ 1

4
var clickHandlerProvider = function(index) {
  return function() {
    $(this).fadeOut(0);
    $('.add-transition.transition_' + index).fadeIn(250);
  };
}
for (var iter = 1; iter <= 2; iter++) {
  $(document).on('click', '.add-plus-btn.transition_' + iter, clickHandlerProvider(iter));
}
1
  • Всё отлично работает! Спасибо!!
    – Vasily U K
    Commented 21 окт. 2016 в 15:37

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.