Question

我有一个.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？现在它每次点击两次。

Answer 1

循环后初始化事件

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

Answer 2

将一个类放到所有相关元素上，并为该类添加一个事件监听器：

HTML

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

的jQuery

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

每个循环的Click事件都会多次触发

2 个答案: