Question

我从这个SF链接进行了编辑：StackOverflow link，用户Blazemonger在其中显示了一个演示，JFiddle Demo

从上面： 1）如何在提交按钮下面的DIV语句中而不是警告框中显示所有错误，而不是一次只显示一个错误？ 2）如果错误正确并再次按下提交按钮，如何将bg颜色更改为白色？

我为问题2编辑了这样的小提琴，但这不起作用：

$("form").submit(function() {
    var submitme = true;
    $(':radio').each(function() {
        nam = $(this).attr('name');
        if (submitme && !$(':radio[name="'+nam+'"]:checked').length) {
            alert(nam+' group not checked');
            $(':radio[name="'+nam+'"]+label').addClass('error');
            submitme = false;
        }
        if (submitme && $(':radio[name="'+nam+'"]:checked').length <> 0) {
                $(':radio[name="'+nam+'"]+label').addClass('noerror');
        }
    });
    return submitme;
});

CSS：

.error {
    background-color: red;
}
.noerror {
    background-color: white;
}

Answer 1

点击该按钮，您可以检查每个组中是否有一个值被选中，如果没有显示div ..

选中此UPDATED FIDDLE

$("form").submit(function() {
    var html = '';
    var submitme = true;
    $(':radio').each(function() {
        nam = $(this).attr('name');
        if (!$(':radio[name="'+nam+'"]:checked').length) {
            $(':radio[name="'+nam+'"]+label').addClass('error');
            if(html.indexOf(nam) < 0){
                html += nam +' group not checked' + '</br>';
            }
            submitme = false;
        }
    });
    if(submitme == false){
       $('.errorDiv').empty().append(html).show().addClass('error');
    }
    else{
      $('.errorDiv').hide();
    }

    return submitme;
});

        
        .error {
            background-color: red;
            display:none;
        }

验证是否选中了所有单选按钮组

1 个答案: