验证单选按钮被选中

Posted

技术标签:

【中文标题】验证单选按钮被选中【英文标题】:Validate radio button is chosen 【发布时间】:2013-10-02 20:47:45 【问题描述】:

我一直在搜索并尝试了很多不同的方法来验证此表单的提交是否适用于单选按钮,但没有成功。

我有一个名为

的表单
user_details

我有几个广播组,一个是

overall_experience

另一个是

promptness

我究竟如何获得我的简单 javascript 函数 validateForm 以确保最终用户选择了每个组中的一个单选按钮?

我有这个(在此处查看屏幕截图)

但是单选校验码不对。

有谁知道如何确保最终用户从每个无线电组中至少选择了一个选项?

【问题讨论】:

请在问题中包含代码。并且您可以在帖子中包含图片而不是图片链接。 你也应该包含调用validateForm函数的代码 validateForm 函数在屏幕抓取中。论坛给我一个在我的帖子中添加代码和图像的问题。对不起。 您可以在此处查看表格 - michaeljbaran.com/form.html 【参考方案1】:

看看这个希望这是你需要的:jsfiddle

<table  border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td>
            <input type="radio" name="overall_experience" value="1" class="a" />1</td>
        <td>
            <input type="radio" name="overall_experience" value="2" class="a" />2</td>
        <td>
            <input type="radio" name="overall_experience" value="3" class="a" />3</td>
        <td>
            <input type="radio" name="overall_experience" value="4" class="a" />4</td>
        <td>
            <input name="overall_experience" type="radio" value="5" class="a" />5</td>
    </tr>
</table>
<br />
</div>
</div>
<div style="width:100%;clear:both;">
    <div class="fullwidth_question"> <span>2. The promptness...they got there when they said they would.</span> 
    </div>
    <div class="fullwidth_answer_indented">
        <table  border="0" cellspacing="0" cellpadding="0">
            <tr>
                <td>
                    <input type="radio" name="promptness" value="1" class="b" />1</td>
                <td>
                    <input type="radio" name="promptness" value="2" class="b" />2</td>
                <td>
                    <input type="radio" name="promptness" value="3" class="b" />3</td>
                <td>
                    <input type="radio" name="promptness" value="4" class="b" />4</td>
                <td>
                    <input type="radio" name="promptness" value="5" class="b" />5</td>
            </tr>
            <input type="button" value="butt" id="butt">

相关的jquery是:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">  </script>
    <script type = "text/javascript">
    $(document).ready(function validater() 
    $("#butt").click(function (event) 
        if($(".a").is(':checked') && $(".b").is(':checked') )
           alert("ok");
            return true;
        elsealert("nok");
      return false;
    );
 );
 </script>

并在表单的 onSubmit 上调用 validater()。

【讨论】:

那没用 - 我用了这个 if(document.getElementByClassName('overall_experience').checked) return true; 其他 返回​​错误; 但它让我提交表单而无需检查整体体验的单选按钮 去这里查看源代码 - 我希望有人能提供帮助。我知道我必须做一些很容易纠正的错误michaeljbaran.com/formNew.html 为您的单选按钮添加类,您尚未在“michaeljbaran.com/formNew.html”中为您的单选按钮添加任何类 你不是在谈论我接受的 css 类 - 你能解释一下我在这段代码中究竟需要更改什么 1 2

以上是关于验证单选按钮被选中的主要内容,如果未能解决你的问题,请参考以下文章

验证是不是选择了所有单选按钮或不在按钮上单击

如何检查单选按钮是不是在 Android 的单选组中被选中?

验证单选按钮AngularJS

单选按钮验证(动态名称)

onSelectStart 处理按钮快速点击选中 文字被选中

jQuery怎样判断按钮是不是被选中