jquery - 选择单选按钮后运行函数

Question

我还没有找到真正询问单选按钮被选择时刻的帖子。我不是在检查值，只是在有人选择任何按钮时检查。

这是我所拥有的:

function turnSubmitBlue() {
$('.formSubmit').css('backgroundColor','#08aae4');
}

$('input:checkbox').each.change(function(){
if ($(this).attr('checked')) {
checkForThreeRadioBtns()
 };
});

function checkForThreeRadioBtns() {
        if (($('input[name=group1]:checked')) && ($('input[name=group2]:checked')) && ($('input[name=group3]:checked'))) {
            turnSubmitBlue();
            }
}

我的思考过程是，在页面加载时，没有选择任何内容，我必须等到从每组中选择一个后，才能通过提交按钮上的颜色更改来指示提交。 (如果他们在从每组中选择一个 radio 之前点击提交，我确实会运行验证)。

一旦选择了三个按钮，运行该函数将“提交”更改为蓝色，显示其他内容(已经工作得很好)。一旦他们点击提交，提交按钮就会变成灰色并显示结果。

此时，始终会选择三个，因此我只需要在发生更改时运行一个函数(通过单击不同的单选按钮)来更改提交按钮。

我的函数 checkForThreeRadioBtns() 应该确保在所有三个组中选择每个 radio 之一，如果是这样，则触发该函数运行turnSubmitBlue()。

我一直在尝试让 jquery 检查单选按钮更改的时刻，但到目前为止还没有成功。

Answer 1

尝试像下面这样，

$('input:checkbox').change(function(){
   if (this.checked) {
     checkForThreeRadioBtns();
   };
});

另请尝试更改您的 if 条件，如下所示，

if ($('input[name=group1]:checked').length && 
        $('input[name=group2]:checked').length && 
        $('input[name=group3]:checked').length)

完整代码:

function turnSubmitBlue() {
    $('.formSubmit').css('backgroundColor','#08aae4');
}

$('input:checkbox').change(function(){
   if (this.checked) {
     checkForThreeRadioBtns();
   };
});

function checkForThreeRadioBtns() {
    if ($('input[name=group1]:checked').length && 
          $('input[name=group2]:checked').length && 
            $('input[name=group3]:checked').length) {
        turnSubmitBlue();
    }
}