A股上市公司传智教育（股票代码 003032）旗下技术交流社区北京昌平校区

传智教育官网黑马程序员官网

 找回密码
 加入黑马

QQ登录

只需一步，快速开始

论坛首页 › 隐藏归类 › 黑马那些年 › 第7届ASP.Net+Unity3D技术交流区 › 正文

怎么用javascript验证输入的有效性啊

© 何红卫 中级黑马   /  2013-3-29 23:46  /  1728 人查看  /  6 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

本帖最后由 何红卫 于 2013-3-31 13:41 编辑

javascript不熟啊，我这代码是要验证输入的用户名必须是字母数字或下划线, 不能以数字开头，否则就是在ID为errorUserName的label里提示错误信息。为什么不管输什么都会提示错误，帮忙看看是哪里的逻辑错了。
  1. <script type="text/javascript">
  2.         function userNameCheck() {
  3.             var userName = document.getElementById("nameId").value;
  4.             document.getElementById("errorUserName").style.color = "red";
  5.             if (!userName) {
  6.                 document.getElementById("errorUserName").innerHTML = "用户名不能为空";
  7.                 document.getElementById("nameId").focus();
  8.             }
  9.             else {
  10.                 for (var i = 0; i < userName.length; i++) {
  11.                     if (typeof (userName.charAt(0)) == Number) {
  12.                         document.getElementById("errorUserName").innerHTML = "用户名必须是字母数字或下划线, 不能以数字开头";
  13.                         return;
  14.                     }
  15.                     if (typeof (userName.charAt(i)) != Number && typeof (userName.charAt(i)) != String && userName.charAt(i) != "_") {
  16.                         document.getElementById("errorUserName").innerHTML = "用户名必须是字母数字或下划线, 不能以数字开头";
  17.                         return;
  18.                     }
  19.                 }
  20.                 document.getElementById("errorUserName").innerHTML = " ";
  21.             }
  22.         }
  23.     </script>
复制代码

评分

参与人数 1技术分 +1 收起 理由
苏波 + 1

查看全部评分

6 个回复

倒序浏览
杜磊 中级黑马 2013-3-30 08:43:07
| 只看该作者
沙发
前端验证基本上都是使用的正则表达式验证的。
你这样单纯的判断是很麻烦的。
var regex=/^(_|[A-Za-z])([A-Za-z0-9][1])/;
这个正则也不知道 对不对  手写的  你试试吧。  
不对的地方 请指教啊

评分

参与人数 1技术分 +1 收起 理由
苏波 + 1

查看全部评分

回复 使用道具 举报
王杰 黑马帝 2013-3-30 10:53:49
| 只看该作者
藤椅
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4.   <title> New Document </title>
  5.         <script type="text/javascript">
  6.         function userNameCheck() {
  7.             var userName = document.getElementById("nameId").value;
  8.             document.getElementById("errorUserName").style.color = "red";
  9.             if (!userName) {
  10.                 document.getElementById("errorUserName").innerHTML = "用户名不能为空";
  11.                 document.getElementById("nameId").focus();
  12.             }
  13.             else {
  14.                            var re="^[a-zA-Z_][A-Za-z0-9_]*$";
  15.                            //alert(userName.match(re));
  16.                            if(userName.match(re)==null){
  17.                                  document.getElementById("errorUserName").innerHTML = "用户名必须是字母数字或下划线.";
  18.                                  return false;
  19.                            }
  20.                                 document.getElementById("errorUserName").innerHTML = " ";
  21.                            return true;
  22.             }
  23.         }
  24.     </script>
  25. </head>

  27. <body>
  28.   
  29.   <form action = "#">
  30.         username:<input type="text" id="nameId"/><div id="errorUserName"></div>
  31.         <input type = "submit" value = "userNameCheck" Onclick = "return userNameCheck();"
  32.   </form>
  33. </body>
  34. </html>
复制代码
回复 使用道具 举报
coolfeiweb 初级黑马 2013-3-30 12:15:15
| 只看该作者
板凳
果断使用正则表达式啊

"^\d+$"　　//非负整数（正整数 + 0）

"^[0-9]*[1-9][0-9]*$"　　//正整数

"^((-\d+)|(0+))$"　　//非正整数（负整数 + 0）

"^-[0-9]*[1-9][0-9]*$"　　//负整数

"^-?\d+$"　　　　//整数

"^\d+(\.\d+)?$"　　//非负浮点数（正浮点数 + 0）

"^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$"　　//正浮点数

"^((-\d+(\.\d+)?)|(0+(\.0+)?))$"　　//非正浮点数（负浮点数 + 0）

"^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"　　//负浮点数

"^(-?\d+)(\.\d+)?$"　　//浮点数

"^[A-Za-z]+$"　　//由26个英文字母组成的字符串

"^[A-Z]+$"　　//由26个英文字母的大写组成的字符串

"^[a-z]+$"　　//由26个英文字母的小写组成的字符串

"^[A-Za-z0-9]+$"　　//由数字和26个英文字母组成的字符串

"^\w+$"　　//由数字、26个英文字母或者下划线组成的字符串

"^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$"　　　　//email地址

"^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$"　　//url


只能输入数字：“^[0-9]*$”
只能输入n位的数字：“^\d{n}$”
只能输入至少n位数字：“^\d{n,}$”
只能输入m-n位的数字：“^\d{m,n}$”
只能输入零和非零开头的数字：“^(0|[1-9][0-9]*)$”
只能输入有两位小数的正实数：“^[0-9]+(.[0-9]{2})?$”
只能输入有1-3位小数的正实数：“^[0-9]+(.[0-9]{1,3})?$”
只能输入非零的正整数：“^\+?[1-9][0-9]*$”
只能输入非零的负整数：“^\-[1-9][0-9]*$”
只能输入长度为3的字符：“^.{3}$”
只能输入由26个英文字母组成的字符串：“^[A-Za-z]+$”
只能输入由26个大写英文字母组成的字符串：“^[A-Z]+$”
只能输入由26个小写英文字母组成的字符串：“^[a-z]+$”
只能输入由数字和26个英文字母组成的字符串：“^[A-Za-z0-9]+$”
只能输入由数字、26个英文字母或者下划线组成的字符串：“^\w+$”
验证用户密码:“^[a-zA-Z]\w{5,17}$”正确格式为：以字母开头，长度在6-18之间，
只能包含字符、数字和下划线。
验证是否含有^%&',;=?$\"等字符：“[^%&',;=?$\x22]+”
只能输入汉字：“^[\u4e00-\u9fa5],{0,}$”
验证Email地址：“^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$”
验证InternetURL：“^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$”
验证电话号码：“^(\(\d{3,4}\)|\d{3,4}-)?\d{7,8}$”
正确格式为：“XXXX-XXXXXXX”，“XXXX-XXXXXXXX”，“XXX-XXXXXXX”，
“XXX-XXXXXXXX”，“XXXXXXX”，“XXXXXXXX”。
验证身份证号（15位或18位数字）：“^\d{15}|\d{}18$”
验证一年的12个月：“^(0?[1-9]|1[0-2])$”正确格式为：“01”-“09”和“1”“12”
验证一个月的31天：“^((0?[1-9])|((1|2)[0-9])|30|31)$”
正确格式为：“01”“09”和“1”“31”。
回复 使用道具 举报
张正强 中级黑马 2013-3-30 17:32:03
| 只看该作者
报纸
在JavaScript中使用自定义正则表达式（手写的，应该没错）

  2. var str=要验证的文本;
  3. function valid(str){
  4. var pattern=new RegExp(/^[\w-]+(\.[\w-])*@([\w-]+\.)+[a-zA-Z]+$/);//可以根据楼上的提供的,修改为所需的正则表达式规则
  5. return pattern.test(str)
复制代码

评分

参与人数 1技术分 +1 收起 理由
苏波 + 1

查看全部评分

回复 使用道具 举报
何红卫 中级黑马 2013-3-31 13:43:04
| 只看该作者
地板
coolfeiweb 发表于 2013-3-30 12:15
果断使用正则表达式啊

"^\d+$"　　//非负整数（正整数 + 0）

谢谢，好好学下，不习惯用这些，还是C#时的思维
回复 使用道具 举报
何红卫 中级黑马 2013-3-31 13:43:46
| 只看该作者
7#
王杰 发表于 2013-3-30 10:53

谢谢，要得就是这个效果
回复 使用道具 举报
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 加入黑马