jquery append()发生了两次

Question

到目前为止,这是我的代码,

$('label').click(function () {
        if ($('label input').is(':checked')) {
            $(this).addClass('checked');
            $('.donate-now label').not(this).removeClass('checked');

            var donateAmount = $(".checked input").val();
            $('p').append(donateAmount);
        }

    });

我正在检查以确保"donateAmount"变量只抓取一个值,所以要测试,我将它附加到HTML,但它会显示两次.

这是append()的函数,我的变量只有一个值,或者是错误的吗？基本上我只是想确保我的变量有一个值.

这是在行动,http://jsfiddle.net/YB8UW/15/

谢谢

Answer 1

尝试将选择器更改为:

$('label input').click(function () {
....
});

http://jsfiddle.net/YB8UW/18/

您的问题是,当您单击收音机时,您正在单击标签AND收音机.由于您单击子元素,因此事件将触发两次.如果您将选择器稍微聚焦一点,并且仅在单击单选按钮时捕获,它将仅触发一次.单击标签也会点击输入.

将其从追加更改为替换并不能解决问题,只需屏蔽它即可.