0

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

$('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/

谢谢

4

3 回答 3

7

尝试将您的选择器更改为：

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

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

您的问题是，当您单击收音机时，您正在单击标签和收音机。由于您正在单击子元素，因此该事件会触发两次。如果您将选择器的焦点再多一点，并且仅在单击单选按钮时捕获，它只会触发一次。单击标签也会触发对输入的单击。

将其从附加更改为替换并不能解决问题，只是掩盖它。

于 2013-04-26T21:37:27.113 回答
3

而不是追加，使用：

$('p').html(donateAmount);

Append 每次都会在该<p>元素中添加一个新元素，而不是替换它的内容。

于 2013-04-26T21:35:52.137 回答
0

您应该.empty()在添加容器之前添加它。:)

http://jsfiddle.net/droppedonjapan/YB8UW/29/

为什么您的事件被触发两次，我不是 100% 确定，但我认为这可能是标签的点击事件发生的方式。我很确定它已委托给您的无线电输入，然后触发另一个标签点击。

我还稍微更改了您的代码以减少嵌套/链接。让我知道这是否会为您解决！

于 2013-04-26T21:40:57.440 回答