HTML和Javascript验证

我想添加一个函数或附加的JavaScript到现有函数进行确认，我需要在表单中插入一个额外的数字字段来获取用户的考试号码，考试号码是4位数字和JavaScript表单将需要验证，它是4位数字我是新来的这个和任何帮助非常感谢。HTML和Javascript验证

这里是我到目前为止的代码

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Exam Entry</title> 

    <script language="javascript" " type="text/javascript "> 

function validateForm() { 
      var result = true; 
      var msg=" "; 

if (document.ExamEntry.name.value==" ") { 
      msg+="You must enter your name \n "; 
      document.ExamEntry.name.focus(); 
      document.getElementById('name').style.color="red "; 
      result = false; 
} 

if (document.ExamEntry.subject.value==" ") { 
      msg+="You must enter the subject \n "; 
      document.ExamEntry.subject.focus(); 
      document.getElementById('subject').style.color="red "; 
      result = false; 
} 


if(msg==" "){ 
return result; 
} 
{ 
alert(msg) 
return result; 
      } 


} 
</script> 
} 
</style> 
</head> 

<body> 
<h1>Exam Entry Form</h1> 
<form name="ExamEntry " method="post " action="success.html "> 
<table width="50% " border="0 "> 
      <tr> 
          <td id="name ">Name</td> 
          <td><input type="text " name="name " /></td> 
      </tr> 
      <tr> 
          <td id="subject ">Subject</td> 
          <td><input type="text " name="subject " /></td> 
      </tr> 

      <tr> 
          <td><input type="submit " name="Submit " value="Submit "   
onclick="return validateForm(); " /></td> 
          <td><input type="reset " name="Reset " value="Reset " /></td> 
      </tr> 
</table> 
</form> 
</body>

来源

2014-03-07 callumtaylorr

的JavaScript代码也有来验证，因为它在以前的领域做的形式不留空。 – callumtaylorr

代码将看起来像

 

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Exam Entry</title> 
<script language="javascript"" type="text/javascript"> 

function validateForm() { 
      var result = true; 
      var msg=""; 

if (document.ExamEntry.name.value=="") { 
      msg+="You must enter your name \n"; 
      document.ExamEntry.name.focus(); 
      document.getElementById('name').style.color="red"; 
      result = false; 
} 

if (document.ExamEntry.subject.value=="") { 
      msg+="You must enter the subject \n"; 
      document.ExamEntry.subject.focus(); 
      document.getElementById('subject').style.color="red"; 
      result = false; 
} 
var patt = new RegExp("^[0-9]{1,4}$"); 

if (!patt.test(document.ExamEntry.examNumber.value)) { 
      msg+="You must enter 4 digit examination number \n"; 
      document.ExamEntry.subject.focus(); 
      document.getElementById('examNumber').style.color="red"; 
      result = false; 
} 

return result; 
      } 

function onSubmit(){ 
    if(confirm('Are you sure to submit')){ 
    return validateForm(); 
    } 
return false; 
} 

</script> 
</style> 
</head> 

<body> 
<h1>Exam Entry Form</h1> 
<form name="ExamEntry" method="post" action="success.html"> 
<table width="50%" border="0"> 
      <tr> 
          <td id="name">Name</td> 
          <td><input type="text" name="name" /></td> 
      </tr> 
      <tr> 
          <td id="subject">Subject</td> 
          <td><input type="text" name="subject" /></td> 
      </tr> 

      <tr> 
          <td><input type="submit" name="Submit" value="Submit"   
onclick="return onSubmit();" /></td> 
          <td><input type="reset" name="Reset" value="Reset" /></td> 
      </tr> 
</table> 
</form> 
</body>

来源

2014-03-07 10:43:49 Haroon

谢谢，非常感谢 – callumtaylorr

您可以使用正则表达式^[0-9]{1,4}$测试匹配4个位数的值，可以在你的JavaScript函数类型只有数字0-9

包含此

var inputVal=document.ExamEntry.name.value; 

var patt = new RegExp("^[0-9]{1,4}$"); 
var res = patt.test(inputVal); 
if(!res) 
{ 
    alert("Please enter a valid 4 digit number"); 
}

来源

2014-03-07 10:28:30

Simple Html is fine

<input type="text" name="pin" maxlength="4" size="4">

来源

2014-03-07 10:28:56

所以我会把这个代码放在哪里，并且它会被验证，所以如果在框中没有输入任何内容，错误信息就会像它在前面的字段中一样出现。 – callumtaylorr

HTML和Javascript验证

回答

相关问题