JavaScript中实现表单验证

来源：动视网责编：小采时间：2020-11-27 20:12:34

JavaScript中实现表单验证

JavaScript中实现表单验证:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script> var names = ["tom","jack","lily","韩梅梅"]; //表单验证 function mySub(){ var

推荐度：

点击下载本文 文档为doc格式

导读JavaScript中实现表单验证:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script> var names = ["tom","jack","lily","韩梅梅"]; //表单验证 function mySub(){ var

<!DOCTYPE html><html>
 <head>
 <meta charset="utf-8" />
 <title></title>
 <script>

 var names = ["tom","jack","lily","韩梅梅"]; //表单验证
 function mySub(){

 var userName = document.forms['myForm']['userName'].value; 
 var pwd = document.forms['myForm']['pwd'].value; var tel = document.forms['myForm']['tel'].value; if(userName.length<3 || userName.length>6){
 alert("用户名必须为3-6位"); return false;
 } //判断用户名是否可用，面向对象的编程思想，原则：高内聚、低耦合
 var b = isName(userName); if(b){
 document.getElementById("isCan").innerHTML = "用户名已存在"; 
 return false;
 }else{
 document.getElementById("isCan").innerHTML = "";
 } //判断用户名是否重复，面向过程// 
 for(var i=0;i<names.length;i++){// 
 var n = names[i];// if(n == userName){// alert("用户名已存在");// return false;// }// }


 if(pwd.length<6){
 alert("密码必须大于6位"); 
 return false;
 } return true;

 } //判断用户名，参数为判断的用户名
 function isName(str){
 for(var i=0;i<names.length;i++){ 
 if(names[i] == str){ 
 return true;
 }
 } 
 return false;
 } </script>

 </head>
 <body >

 <h1>用户注册</h1>
 <span>规则：用户名长度为3-6个字符</span>
 <hr />
 <form name="myForm" action="a.html" method="get" onsubmit="return mySub()">
 <p>
 用户名：<input name="userName" type="text" /><span id="isCan" style="color: red;"></span>
 </p>
 <p>
 密码：<input name="pwd" type="password" />
 </p>
 <p>
 电话：<input name="tel" type="text" />
 </p>
 <p>
 <input type="submit" />
 </p>
 </form>

 </body></html>

JavaScript中实现表单验证

JavaScript中实现表单验证:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script> var names = ["tom","jack","lily","韩梅梅"]; //表单验证 function mySub(){ var

推荐度：

点击下载本文 文档为doc格式

标签：验证实现 js

热门焦点

JavaScript中实现表单验证

JavaScript中实现表单验证

JavaScript中实现表单验证

最新推荐

猜你喜欢

热门推荐