使用JavaScript进行PHP表单验证

Question

我正在开发一个使用php和mysql的应用程序。我编写了一个JavaScript代码进行表单验证，但是它可以正常工作。

     function checkForm()
        { if(document.Form1.Gestational_age.value=="")
                {
                   alert('Please select an option for Gestational age in weeks ') ;
                   return false;
                }
            else if(document.Form1.PRBC.value=="")
                {
                    alert('Please select an option for PRBC transfusion ');
                    return false;
                }
            else if(document.Form1.milk_feeding.value=="")
                {
                    alert('Please select an option for Human milk feeding at both day 7     and day 14 of life');
                    return false;
                }
    }
   </script>

    <title>GutCheckNEC for infants < 1500 grams at birth Gephart,2012</title>

   </head>
   <body>

    <div><b>GutCheckNEC   for infants < 1500 grams at birth Gephart, 2012</b></div>
    <br>
    <form name="Form1" method="post" action ="Form1.php" onSubmit="return checkForm();">
        1.&nbsp;&nbsp;&nbsp Gestational age in weeks&nbsp;&nbsp;&nbsp
         <input type="radio" id="Gestational_age" name="Gestational_age" value="0-27"/>0-27
         <input type="radio" name="Gestational_age" value="28-31"/>28-31
         <input type="radio" name="Gestational_age" value=">32" />32
         <br>

        2.&nbsp;&nbsp;&nbsp PRBC transfusion&nbsp;&nbsp;&nbsp
        <input type="radio" id="PRBC" name="PRBC" value="Yes"/>Yes
         <input type="radio" name="PRBC" value="No"/>No
         <br>
        3.&nbsp;&nbsp;&nbsp Human milk feeding at both day 7 and day 14 of life&nbsp;&nbsp;&nbsp
        <input type="radio" id="milk_feeding" name="milk_feeding" value="Yes"/>Yes
         <input type="radio" name="milk_feeding" value="No"/>No
         <br>

     <input type="submit" name="submit" value="Next"/>
    </form>
    </body>
   </html>

这是我的代码示例。请您帮助一下，为什么我的javascript部分无法正常工作。

Answer 1

以此替换验证功能，然后尝试。 这将检查该值是否已设置。

    function checkForm()
    { 
        if(!document.forms["Form1"]["Gestational_age"][0].checked && !document.forms["Form1"]["Gestational_age"][1].checked && !document.forms["Form1"]["Gestational_age"][2].checked)
            {
               alert('Please select an option for Gestational age in weeks ') ;
               return false;
            }
        else if(!document.forms["Form1"]["PRBC"][0].checked && !document.forms["Form1"]["PRBC"][1].checked)
            {
                alert('Please select an option for PRBC transfusion ');
                return false;
            }
        else if(!document.forms["Form1"]["milk_feeding"][0].checked && !document.forms["Form1"]["milk_feeding"][1].checked)
            {
                alert('Please select an option for Human milk feeding at both day 7 and day 14 of life');
                return false;
            }
    }

Answer 2

这是一个例子

<script>
function checkForm(){ 
if(Form1.Gestational_age[0].checked==false && Form1.Gestational_age[1].checked==false && Form1.Gestational_age[2].checked==false)
   {
      alert('Please select an option for Gestational age in weeks ') ;
      return false;
    }           
   else {
     return true;   
   }
}
</script>

我仅对第一组单选按钮执行了此操作。 希望这能给您一个想法。

Answer 3

您不能像这样获得单选按钮的价值：

document.Form1.Gestational_age.value

这样使用

var ages = document.getElementsByName('Gestational_age');
var ageIsChecked = false;
for (var i = 0, length = ages.length; i < length; i++) {
    if (ages[i].checked) {
        ageIsChecked = true;
    }
}
if (!ageIsChecked) {
    alert('Please select an option for Gestational age in weeks ');
    return false;
}

Answer 4

尝试一下， Gestational_age是带有数组的名称，因此您需要以["Form1"]["Gestational_age"]身份传递，并且还需要checked属性以检查单选按钮是否已选中的单选按钮长度。

function checkForm()
{ 
    if(document.forms["Form1"]["Gestational_age"].checked == "")
    {
        alert('Please select an option for Gestational age in weeks ') ;
        return false;
    }
    else if(document.forms["Form1"]["PRBC"].checked == "")
    {
        alert('Please select an option for PRBC transfusion ');
        return false;
    }
    else if(document.forms["Form1"]["milk_feeding"].checked == "")
    {
        alert('Please select an option for Human milk feeding at both day 7     and day 14 of life');
        return false;
    }
}

因为我已经测试过，它会根据需要提醒您验证。