0

我需要我的 Javascript 文件来验证用户输入。它应该确保名称仅为字符，年龄不小于18且不大于110，并且选择了一个项目。我还希望它拒绝任何格式不正确的表格。我试图让脚本验证焦点所在的输入框。我有什么问题？

<!--catalog.php
    A catalog exploring different study material in IT.
    -->

<head>
<link type="text/css" rel="stylesheet" href="style.css"/>
  <title>Study Guides</title>
</head>
<body>
<h2 align="center">A Simple Table for Certification Preparation</h2>
<center>
  <label><p>Name: <input type="text" id="custName"; onchange= "custName_onchange()"; size="32";</p></label>
  <label><p>Age: <input type="text" id="custAge" onblur="custAge()" size="3" maxlength="3";</p></label>

<table border="1">

<tr><th>Selection</th> <th>Book</th> <th>Image</th> <th>Description</th> <th>Unit Price</th></tr>

<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$34.13" checked = "checked" /></label></p></td>
<td>CompTIA A+</td> 
<td><img src = "images/A+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA A+ Book"/></td> 
<td>The CompTIA A+ certification is the starting point for a career in IT. The exam covers maintenance of PCs, mobile devices, laptops, operating systems and printers.</td>
<td>$34.13</td>
</tr>

<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$31.16" checked = "checked" /></label></p></td>
<td>CompTIA Network+</td> 
<td><img src = "images/Network+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA Network+ Book"/></td> 
<td>The exam covers network technologies, installation and configuration, media and topologies, management, and security. Candidate job roles include network administrator, network technician, network installer, help desk technician and IT cable installer.</td>
<td>$31.16</td>
</tr>

<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$29.08" checked = "checked" /></label></p></td>
<td>CompTIA Security+</td> 
<td><img src = "images/Security+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA Security+ Book"/></td> 
<td>CompTIA Security+ not only ensures that candidates will apply knowledge of security concepts, tools, and procedures to react to security incidents, it ensures that security personnel are anticipating security risks and guarding against them.</td>
<td>$29.08</td>
</tr>

<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$35.17" checked = "checked" /></label></p></td>
<td>CompTIA Linux+</td> 
<td><img src = "images/Linux+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA Linux+ Book"/></td> 
<td>CompTIA Linux+ Powered by LPI is a high-stakes, vendor-neutral certification that validates the fundamental knowledge and skills required of junior Linux administrators.</td>
<td>$35.17</td>
</tr>

<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$31.50" checked = "checked" /></label></p></td>
<td>Cisco CCNA</td> 
<td><img src = "images/CCNA.jpeg" height = "150" width = "100" alt= "Picture of Cisco CCNA Book"/></td> 
<td> The CCNA Routing and Switching validates the ability to install, configure, operate, and troubleshoot medium-size routed and switched networks.</td>
<td>$31.50</td>
</tr>
</table>

<form action = "" id="form1">
  <p>
     <input type = "button" value = "submit" id="btnSubmitForm" onclick="btnSubmitForm_onclick()"/>
     <input type = "button" value = "reset" />
  </p>
</form>

<a href= "Home.php">Back to Home</a><br />
<script type = "text/javascript" src = "catalog.js" >
    </script>
</p>
</form>   
</center>
</body>
</html>

//JavaScript to Validate Form
function btnSubmitForm_onclick()
{
var myForm= document.form1;

   if(myForm.custAge.value=="" || myForm.custName=="")
   {
   alert("Please fill out entire form before submission.");
   if(myForm.custName=="")
   {
   myForm.custName.focus();
   }
   else
   {
   myForm.custAge.focus();
   }
}
   else
   {
   alert("Submission Accepted" + myForm.custName.value);
   }
}


function custAge_onblur()
{
   var custAge= custAge;
      if (isNaN(custAge.value)==true)
      {
      alert("Please enter a valid age");
      custAge.focus();
      custAge.select();
      }
   if (age>=18 || age<=110)
   {
   return true;
   }
   if(!(age>=18 || age<=110))
   {
   alert("Your age is NOT between 18 and 110.")
   return false;
   }
}


function custName_onchange()
{
   var custName= custName;
      if(custName<4)
      {
      alert("The name you entered ("+custName.value+
      ")is not in the correct form. \n"+
      "The correct form is: First-name Last-name \n"+
      "Please try again.")
      return false;
      }
      else
      {
      return true;
      }
}
4

1 回答 1

0

您需要将文本框和其他表单字段放在表单内，而不是表单外。在表格开始之前移动表格标签，在表格结束标签之后结束表格 tAg

<form action="" id="form1">
<table border="1">
...
</table>
</form>
于 2013-06-23T02:18:48.380 回答