单选按钮验证不起作用

Radio button Validation not working

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

我需要验证单选按钮,我正在努力找到问题来自哪里。

基本上,当我提交时,它不会验证表单和它的所有字段。我知道是这个函数导致了问题,因为当它从.js文件中取出时,表单会正确验证。

下面是我的HTML文件中包含单选按钮的部分

<tr>
    <th align="left">Driver Required: </th>
    <td>
        <input type="radio" name="Driver" value="Yes" id="radio_error"> Yes
    </td>
 </tr>
 <tr>
 <td><br></td>
 <td>
     <input type="radio" name="Driver" value="No" id="radio_error"> No
 </td>
 </tr>
 <tr><th><br></th></tr>
     <tr>
         <th align="left">Insurance: </th>
         <td>
             <input type="radio" name="Insurance" value="None" id="radio_error"> None
          </td>
  </tr>
  <tr>
      <td><br></td>
      <td>
          <input type="radio" name="Insurance" value="CDW" id="radio_error"> Collision Damage Waiver
          <br>
          <input type="radio" name="Insurance" value="LI" id="radio_error"> Liability Insurance
          <br>
          <input type="radio" name="Insurance" value="PAI" id="radio_error"> Personal Accident Insurance
          <br>
          <input type="radio" name="Insurance" value="PEC" id="radio_error"> Personal Effects Coverage
      </td>
  </tr>

以下代码行来自.js文件。我有一个验证函数,我确信这不是问题所在。

function checkDriverRadio()
{
    var yesOrNo = "";
    var len = document.ClientForm.Drvier.length;
    var i;
    for (i = 0; i < len; i++) 
    {
        if (document.ClientForm.Drvier[i].checked)
        {
            yesOrNo = document.ClientForm.Driver[i].value;
            break;
        }
    }
    if (!document.ClientForm.Driver.checked)
    {
        document.getElementById("radio_error").innerHTML = "No option selected";
        return false;
    }
    else
    {
        document.getElementById("radio_error").innerHTML = "";
        return true;
    }
}
function checkInsuranceRadio()
{
    var option = "";
    var len = document.ClientForm.Insurance.length;
    var i;
    for (i = 0; i < len; i++) 
    {
        if (document.ClientForm.Insurance[i].checked)
        {
            option = document.ClientForm.Insurance[i].value;
            break;
        }
    }
    if (!document.ClientForm.Insurance.checked)
    {
        document.getElementById("radio_error").innerHTML = "No option selected";
        return false;
    }
    else
    {
        document.getElementById("radio_error").innerHTML = "";
        return true;
    }
}

我想这里有一个拼写错误…

if (document.ClientForm.Drvier[i].checked)
    {
        yesOrNo = document.ClientForm.Driver[i].value;
        break;

…您的文件名是Driver而不是Driver。

我意识到你所有的单选按钮都有相同的Id,单选按钮按name="someName"分组,这是你所做的,正如其他答案所提到的,你有一些排版错误需要注意。我在这里创建了一个简单的验证,如果有帮助的话,请检查一下。

https://jsfiddle.net/mr_odoom/17xwdL79/