Нажмите событие для каждого цикла срабатывает несколько раз

У меня есть .each цикл вроде этого:Нажмите событие для каждого цикла срабатывает несколько раз

$('.form-base-subscriptions input').each(function (index, value) { 
    var uniqueId = $(this).attr('id'), 
     uniqueId = uniqueId.substring(uniqueId.lastIndexOf('_')), 
     $parent = $(this).parent(), 
     $content = $parent.html(); 
     $content = $content.split('~'), 
     input = $content[0], 
     amount = $content[4], 

var $toggle = $parent.find('.form-toggle'), 
    $checkbox = $toggle.find('input'); 

    $toggle.on('click', function() { 
     $('.form-base-subscriptions .form-toggle').removeClass('active'); 
     $('.form-base-subscriptions input').prop('checked', false); 
     $toggle.addClass('active'); 
     $checkbox.prop('checked', true); 

      var currentId = $(this).attr("id"); 

      if (currentId == "toggle_151" || currentId == "toggle_170") { 
       amount = '1.50'; 
      } else { 
       console.log('check'); 
       amount = '0'; 
      } 

      $('#toggle_153 input').attr('data-amount', amount); 
      $('#toggle_153 span').html(amount); 

     //updateWellnessPrice(); 
     updateSubscriptionAmount(); 
    });

Как я вызвать этот onCLick event только один раз за клик? Теперь он запускается дважды за клик.

источник

2016-05-06 Sreinieren

переместите клик ev из цикла '.each'. Прямо сейчас вы регистрируете событие click несколько раз из-за цикла. – Krishna

Возможно, это не связано, но вы, кажется, бросаете переменные в глобальную область из-за изгоев ';' (или, скорее всего, из-за изгоев ',' s, и вы не объявляете все переменные в верхней части). – Sumurai8

Необходимо увидеть соответствующий html - в частности, есть один '.form-toggle' (как следует из названия и ошибки) или по одному на каждый вход (как следует из кода). Если есть только один, вы хотите обеспечить '$ toggle.on ('click'' вызывается только один раз. –

Initialize событие после цикла

var $toggle = ''; 
    $('.form-base-subscriptions input').each(function (index, value) { 
    var uniqueId = $(this).attr('id'), 
     uniqueId = uniqueId.substring(uniqueId.lastIndexOf('_')), 
     $parent = $(this).parent(), 
     $content = $parent.html(); 
     $content = $content.split('~'), 
     input = $content[0], 
     amount = $content[4], 

    $toggle = $parent.find('.form-toggle'), 
    $checkbox = $toggle.find('input'); 
}); 

$toggle.on('click', function() { 
      $('.form-base-subscriptions .form-toggle').removeClass('active'); 
      $('.form-base-subscriptions input').prop('checked', false); 
      $toggle.addClass('active'); 
      $checkbox.prop('checked', true); 
      updateWellnessPrice(); 
      updateSubscriptionAmount(); 
     });

источник

2016-05-06 12:20:18 Raki

Инициализировать событие после цикл и объявить флажок $ toggle и $ глобально – Raki

Почему я должен устанавливать переменные gloablly? – Sreinieren

, если вы объявляете $ toggle внутри цикла, тогда переменная переменной будет внутри цикла, здесь у меня есть событие регистрации вне цикла, поэтому переменная $ toggle scope будет доступен за пределами цикла, если вы объявите внешний (это не должно быть глобальным, но объявить вне цикла). – Raki

Поставьте класс для всех соответствующих элементов и добавить прослушиватель события для этого класса:

HTML

<div id="toggle_n" class="myElem"> .. </div> 
...

JQuery

$(document).on('click', '.myElem', function() { 
    // Do your stuff here .. 
});

источник

2016-05-06 12:17:55 kapantzak

Нажмите событие для каждого цикла срабатывает несколько раз

ответ

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