单选按钮未正确验证

Radio buttons not validating correctly

本文关键字:验证 单选按钮      更新时间:2023-09-26

我有这份问卷,我用它来启动一个应用程序。我在提交之前使用 javascript 进行验证,但我遇到了一个问题,它只验证每个问题的第二个按钮,而不是单独验证每个问题。我在下面发布了代码。

问卷

<?
    for($i = 1; $i <= count($questions); $i++){
        print "<div class='form-group'>";
            print "<div class='col-md-12'>";
                print "<p>$i) ".$questions[$i-1]."</p>";
                print "<label class='radio-inline'>";
                    print "<input type='radio' name='q$i' value='1'>Yes";
                print "</label>";
                print "<label class='radio-inline'>";
                    print "<input type='radio' name='q$i' value='-1'>No";
                print "</label>";
            print "</div>";
        print "</div>";
    }
?>

爪哇语

$(function(){
    $('#questionaire-form').submit(function(e){
        e.preventDefault();
        var prevname = "";
        var questions = [];
        $('.radio-inline').each(function(){
            //$(this).next($(this)).is(':checked'));            
            var curname = $(this).find('input[type="radio"]').attr('name');
            if(prevname == curname){
                if(!$(this).find('input[name='+curname+']').is(':checked') && $(this).closest('div').find('p').hasClass('text-danger')){
                    return true; //skip to the next element
                }else if(!$(this).find('input[name='+curname+']').is(':checked') && !$(this).closest('div').find('p').hasClass('text-danger')){
                    $(this).closest('div').find('p').addClass('text-danger');
                }else if($(this).find('input[name='+curname+']').is(':checked') && $(this).closest('div').find('p').hasClass('text-danger')){
                    $(this).closest('div').find('p').removeClass('text-danger');
                }else{
                    $(this).closest('div').find('p').removeClass('text-danger');
                }
            }
            prevname = curname;
        });
        var go;
        $('.radio-inline').closest('div').find('p').each(function(){
            if($(this).hasClass('text-danger')){
                go = false;
                return false;
            }else{
                go = true;
            }
        });
        if(go){
        }
    });
});

如有需要,请询问更多信息。我已经在这个问题上停留了一段时间,我想快速解决它。单选按钮验证一直是我的弱点,所以征服今天会很棒

这个怎么样:

var go = true;
$(".form-group").each(function () {
     if($(this).find('input[type="radio"]:checked').length == 0) {
         //nothing checked so error.
         $(this).find('p').addClass('text-danger');
         go = false;
     }
     else {
         $(this).find('p').removeClass('text-danger');
     }

});
if(!go)
{return false;}
//continue and do what you like

更新

在小提琴中测试:http://jsfiddle.net/6k0nusfb/