使用可重复的Javascript函数验证多个单选按钮组_Javascript_Html_Forms

使用可重复的Javascript函数验证多个单选按钮组

javascript html forms

使用可重复的Javascript函数验证多个单选按钮组,javascript,html,forms,Javascript,Html,Forms,我在这里（以及通过谷歌）浏览了许多不同的问题，但没有找到一个接近我所寻找的答案我有一个表单（使用表设置），它有多个单选按钮组，我正试图使用JS验证这些组。我知道我可以为每个组编写一个函数来完成所需的任务，但是我正在尝试使用尽可能少的函数来简化我的JS脚本我正在尝试编写一个函数，该函数将检查选择了哪个单选按钮，并根据所做的选择执行不同的任务 HTML代码： <tr> <td class="left"><span class="require

我在这里（以及通过谷歌）浏览了许多不同的问题，但没有找到一个接近我所寻找的答案

我有一个表单（使用表设置），它有多个单选按钮组，我正试图使用JS验证这些组。我知道我可以为每个组编写一个函数来完成所需的任务，但是我正在尝试使用尽可能少的函数来简化我的JS脚本

我正在尝试编写一个函数，该函数将检查选择了哪个单选按钮，并根据所做的选择执行不同的任务

HTML代码：

    <tr>
        <td class="left"><span class="required">*</span>Only approved Ingredients Used:</td>
        <td>
            <label><input name="approve" type="radio" required id="approve_0" value="Yes">Yes</label>
            <label><input name="approve" type="radio" required id="approve_1" value="No">No</label>
        </td>
    </tr>


*仅使用经批准的成分：
对
不

对于每一个这样的部分（我有大约15个这样的部分），我试图给我们提供一个“onChange=”somefunction（）“调用，这将导致一条错误消息”（标签名）必须完成”，并导致出现一个文本框，供用户在提交表单之前输入“纠正措施”

任何帮助都将不胜感激

我还想远离jquery，因为实际上并不需要JavaScript。您需要将

输入

封装在

表单

元素中，然后您将看到

必需的

可以工作。注意：我禁用了JS

更新

重新阅读你的帖子，这样我就扩展了代码，但我遗漏了一些东西…：\

var submit=document.getElementById（'submit'）；
var approve=document.getElementsByClassName（'approve'）；
函数approveRad（）{
选择的var=false；
对于（变量i=0；i


tr{
宽度：30%；
}
输入{
轮廓：1px纯蓝色；
}

*仅使用经批准的成分：
对
不
对
不
对
不
对
不
当您选择一个单选按钮，然后调用一个javascript函数，并将该单选按钮的名称传递给一个类型。以及
根据传递的参数，您可以区分单选按钮的类别
在javascript函数中，使用if和else进行代码分离



单击的函数（类型）{
如果（类型=‘公司’）{
var selectedRadio=document.getElementsByName（类型）；
对于（i=0；i
var submit=document.getElementById（'submit'）；
var approve=document.getElementsByClassName（'approve'）；
函数approveRad（）{
选择的var=false；
对于（变量i=0；i

tr{
宽度：30%；
}
输入{
轮廓：1px纯蓝色；
}

*仅使用经批准的成分：
对
不
对
不
对
不
对
不
此代码的难点在于，如果我有多个组，其中包含“相同的两个选项”，那么您的所有单选按钮都属于同一个单选组。我再次尝试确定“是”或“否”已选择选项以确定是否需要解释。您可以更改每个组的radios“name
属性，而不是使用getElementsByName
使用querySelectorAll（'input[type=“radio”]”）
。您不太清楚各个组，也没有现场演示。如果您不明白，请告诉我。通过调用querySelectorAll（'input[type=“radio”]”）
这会一次抓取所有单选按钮，还是只抓取发起呼叫的组？所有这些按钮都作为静态HTMLCollection进行收集。在进行分类时，请注意收音机的id，是的是偶数编号的id（包括0），否的是奇数编号的id。好的，我（或用户）知道点击“提交”按钮，表单将收集所有这些信息，并通过函数对其进行分析。在填写表单时（即对每个无线组使用onChange（）），是否有方法进行分析（根据具体情况）？
<head>
    <script  type="text/javascript">
         function clicked(type){
              if(type == 'company'){
                     var selectedRadio = document.getElementsByName(type);
                     for (i=0; i<selectedRadio.length; i++){
                            if(selectedRadio[i].checked == true)
                                 alert('you select  ' + selectedRadio[i].value);
                     }
               }else if(type == 'post'){
                     var selectedRadio = document.getElementsByName(type);
                     for (i=0; i<selectedRadio.length; i++){
                            if (selectedRadio[i].checked == true)
                                alert('you select  ' + selectedRadio[i].value);
                     }
               }

          }
    </script>

</head>

<body>    
<form>
Select company :
<br>
  <input type="radio"  id="company" name="company" value="TCS" onclick="clicked('company')"> TCS
  <br>
  <input type="radio"  id="company" name="company" value="WIPRO" onclick="clicked('company')"> WIPRO
 <hr>
Select Desigination :
<br>
  <input type="radio"   id="post"  name="post" value="manager"  onclick="clicked('post')" >manager
  <br>
  <input type="radio"  id="post" name="post" value="developer"  onclick="clicked('post')">developer
</form>
<hr>





</body>
</html>