按类名验证单选按钮的窗体

Form validating radio buttons by class name

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

我正在使用以下脚本：

 if($('.fmscr:checked').val()){
        $('.fmscr').closest('.form-group').removeClass('has-error');
        $('.fmscr').closest('.form-group').addClass('has-success');
    }else{
        $('.fmscr').closest('.form-group').addClass('has-error');
        $('.fmscr').closest('.form-group').removeClass('has-success');
    }

在以下收音机上以表格形式显示：

    <div class='form-group'>
        <div class='col-xs-12'>
            <p>
            Were you subject to the (FMSCR's) Department of Transportation (DOT) Regulations while employed?<span class='req'> *</span>
            </p>
            <label class='radio-inline'>
                <input type='radio' class='fmscr checked' name='fmscr[]' value='1'> Yes
            </label>
            <label class='radio-inline'>
                <input type='radio' class='fmscr checked' name='fmscr[]' value='-1'> No
            </label>
        </div>
    </div>

单选按钮的数量尚未确定。上面的脚本是在提交时运行的，但它不计算单选按钮，直到两个单选按钮都被选中，而且只有一个单选按钮被选中。那么我在这里做错了什么？我希望能够检查所有单选按钮，无论数量如何，并使它们能够正确验证。如果需要任何进一步的信息，请告诉我！提前谢谢。

如果您确实有多组radio按钮共享同一个类选择器，那么以下代码应该会有所帮助：

$('.fmscr:checked').each(function() {
   if( this.value ) {
        $(this).closest('.form-group').removeClass('has-error');
        $(this).closest('.form-group').addClass('has-success');
    } else {
        $(this).closest('.form-group').addClass('has-error');
        $(this).closest('.form-group').removeClass('has-success');
    }
});

您的代码

if ($('.fmscr:checked').val())

只考虑与选择器匹配的第一个找到的元素。有关详细信息，请参见此处：http://api.jquery.com/val/我不知道你到底想做什么，但你可以这样尝试：

if ($('.fmscr:checked').length > 0 )) // at least one is checked

祝你好运！

相关文章：