Javascript 表单验证工作不正常_Javascript_Html_Validation

Javascript 表单验证工作不正常

javascript html validation

Javascript 表单验证工作不正常,javascript,html,validation,Javascript,Html,Validation,JavaScript无法正确验证表单。如果未输入所需字段，而不是显示警告框，则浏览器只会加载到下一页，就像用户输入了字段一样 <head> <script type="text/javascript"> function inputValidation() { var dateBox= document.forms["form"]["date"].value; if (dateBox== null || dateBox== "") { al

JavaScript无法正确验证表单。如果未输入所需字段，而不是显示警告框，则浏览器只会加载到下一页，就像用户输入了字段一样

<head>
<script type="text/javascript">
  function inputValidation() {
    var dateBox= document.forms["form"]["date"].value;
    if (dateBox== null || dateBox== "") {
      alert("Please enter an approximate date.");
      return false;
    }
  }
</script>

</head>
<body>

  <form name="form" id="form" action="add.php" onsubmit="inputValidation()" method="post">
    <fieldset id="contactFields">
      <legend>Client Information</legend><br>
      <p id="require"><span>*</span>Required information</p><br>
      <table width="291" height="158">
        <tr>
          <td>Approximate Date Serviced:<span>*</span></td>
          <td><input type="text" name="date" id="date" size="20" maxlength="25">
        </tr>

        <tr>
          <td>First Name:</td>
          <td><input type="text" name="fName" id="fName" size="20" maxlength="25" /></td>
        </tr>
        <tr>
          <td>Last Name:</td>
          <td><input type="text" name="lName" id="lName" size="20" maxlength="25"/></td>
        </tr>
      </table>
      <label class="blockLabel">Comments:<span>*</span><br><textarea name = "comment" id="comment" rows="5" cols="55"></textarea>

      <label id="wordcountLabel" for="wordcount">
        <div>Character Count:<input type="text" id="wordcount" readonly="readonly" value="0/0"></div>
      </label>
    </fieldset>
    <div id="submit"><input text-align="center" class="button1" type="submit" value="Submit"></div>
    <input text-align="center" class="button3" type="reset" value="Reset" />
  </form>
</body>


函数inputValidation（）{
var dateBox=document.forms[“form”][“date”].value；
如果（日期框==null | |日期框==“”）{
警报（“请输入大致日期”）；
返回false；
}
}
客户信息

*所需信息
大概服务日期：*
名字：
姓氏：
评论：*

字符计数：

有什么想法吗？请帮忙

您是否尝试过使用浏览器调试并检查日期框的值？？我从未见过这样引用的表单值，它可能无法获得您需要的值。

您是否尝试过使用浏览器调试并检查dateBox的值？？我从未见过这样引用的表单值，它可能无法获得您需要的值。

假设代码正常工作，但只有验证无效-我猜您需要以下内容：

onsubmit="return inputValidation()"

完整代码：

<head>
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function inputValidation()
{
  var dateBox= document.forms["form"]["date"].value;
  if (dateBox== null || dateBox== "")
  {
      alert("Please enter an approximate date.");
      return false;
  }
  return true;
}
</script>    
</head>
<body>    
<form name="form" id="form" action="add.php" onsubmit="return inputValidation()" method="post">    
  <fieldset id="contactFields">    
  <legend>Client Information</legend><br />    
<p id="require"><span>*</span>Required information</p><br />    
<label class="blockLabel">Approximate Date Serviced: <span>*</span><br/><input type="date" name = "date" id="date"/><br/><br/>
<label class="blockLabel">First Name: <span>*</span><br/><input type="text" name = "firstName" id="firstName"/><br/><br/>
<label class="blockLabel">Last Name: <span>*</span><br/><input type="text" name = "lastName" id="lastName"/><br/><br/>

<label class="blockLabel">Comments:<span>*</span><br/><textarea name = "comment" id="comment" rows="5" cols="55"></textarea>

<label id="wordcountLabel" for="wordcount">
<div>Character Count:<input type="text" id="wordcount" readonly="readonly" value="0/0" /></div>
</label>

</fieldset>
  <div id="submit"><input text-align="center" class="button1" type="submit" value="Submit" /></div>

<input text-align="center" class="button3" type="reset" value="Reset" />
</form>
</body>


函数inputValidation（）
{
var dateBox=document.forms[“form”][“date”].value；
如果（日期框==null | |日期框==“”）
{
警报（“请输入大致日期”）；
返回false；
}
返回true；
}
客户信息

*所需信息
大概服务日期：*



名字：*



姓氏：*



评论：*

字符计数：

假设代码正常工作，但只有验证不正常-我猜您需要以下内容：

onsubmit="return inputValidation()"

完整代码：

<head>
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function inputValidation()
{
  var dateBox= document.forms["form"]["date"].value;
  if (dateBox== null || dateBox== "")
  {
      alert("Please enter an approximate date.");
      return false;
  }
  return true;
}
</script>    
</head>
<body>    
<form name="form" id="form" action="add.php" onsubmit="return inputValidation()" method="post">    
  <fieldset id="contactFields">    
  <legend>Client Information</legend><br />    
<p id="require"><span>*</span>Required information</p><br />    
<label class="blockLabel">Approximate Date Serviced: <span>*</span><br/><input type="date" name = "date" id="date"/><br/><br/>
<label class="blockLabel">First Name: <span>*</span><br/><input type="text" name = "firstName" id="firstName"/><br/><br/>
<label class="blockLabel">Last Name: <span>*</span><br/><input type="text" name = "lastName" id="lastName"/><br/><br/>

<label class="blockLabel">Comments:<span>*</span><br/><textarea name = "comment" id="comment" rows="5" cols="55"></textarea>

<label id="wordcountLabel" for="wordcount">
<div>Character Count:<input type="text" id="wordcount" readonly="readonly" value="0/0" /></div>
</label>

</fieldset>
  <div id="submit"><input text-align="center" class="button1" type="submit" value="Submit" /></div>

<input text-align="center" class="button3" type="reset" value="Reset" />
</form>
</body>


函数inputValidation（）
{
var dateBox=document.forms[“form”][“date”].value；
如果（日期框==null | |日期框==“”）
{
警报（“请输入大致日期”）；
返回false；
}
返回true；
}
客户信息

*所需信息
大概服务日期：*



名字：*



姓氏：*



评论：*

字符计数：

引用表单值“像那样”从一开始就是javascript的一部分。你的答案可能应该是一个评论，因为它不是一个答案。我感谢你的投入，但至少对找到答案有所贡献。这就是这个地方的目的，对吧？你发布的答案更适合作为评论。Alfasin在你的答案之前发布了一个（大部分是正确的）答案，所以我提交另一个答案没有意义。从一开始，引用表单值“像那样”就是javascript的一部分。你的答案可能应该是一个评论，因为它不是一个答案。我感谢你的投入，但至少对找到答案有所贡献。这就是这个地方的目的，对吧？你发布的答案更适合作为评论。Alfasin在你之前发布了一个（大部分是正确的）答案，因此我提交另一个答案毫无意义。@RobG我相信我们达成了一致：）@RobG现在问题已经解决了-答案也是如此：）@RobG我相信我们达成了一致：）@RobG现在问题已经解决了-答案也是如此：）