时间校验

最新推荐文章于 2024-06-13 10:02:14 发布

转载最新推荐文章于 2024-06-13 10:02:14 发布 · 1.9k 阅读

文章标签：

#function #javascript #mobile #input #手机 #正则表达式

js 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种使用JavaScript在前端验证用户输入是否为纯数字的方法，并提供了身份证号码和手机号码等特定场景下的验证函数。

在web开发中，会经常遇到需要提交表单（FORM）信息到后台进行处理，在这个表单上往往都会有需要用户填写纯数字的项目，例如在用户注册时候要求填写年龄、身高、手机号码、身份证号码等等。
一个比较好的web程序就是在前台（即在浏览器端）就可以对用户填写的这些信息做校验，如果有非数字存在，就停止提交，提示用户改正，这样比提交到后台（服务器端）校验更快捷，也会有更好的用户感受。
下面举一个JavaScript的通用代码作例子，详细介绍一下如何对这些纯数字域的项目进行前台校验。
源码如下：
//check if the string is only digit
function CheckDigit(objDigit, txtTitle)
{
var strDigit=objDigit.value;

if(isNaN(strDigit))
{
    alert(txtTitle + "只能使用数字！");
    objDigit.focus();
    return false;
}
return true;
}

上面这段代码中，需要介绍一下的只不过是CheckDigit函数的两个参数。这两个参数搞清楚了，就可以直接拿过来用了。至于里面的实现有不懂的地方都好说，查一下JavaScript开发参考就行了。
第一个参数objDigit是指要校验的对象，比如用户填写的年龄信息是一个名字为age的文本框，而表单名字为form1，那么这个参数objDigit指的是window.document.form1.age。注意，这里的objDigit并非是指需要校验的“字符串”，不能传值window.document.form1.age.value。
第二个参数txtTitle是指校验对象的名称。这个是有用户自己定的，用于出现校验不通过时候显示提示信息的。还用刚才的例子，objDigit指window.document.form1.age时候，txtTitle应该为“年龄”。
下边给出这个例子的完整代码：
<html>
<head>
<title>JavaScript校验数字域的例子</title>
</head>
<script language="JavaScript">
//check if the string is only digit
function CheckDigit(objDigit,txtTitle)
{
var strDigit=objDigit.value;

if(isNaN(strDigit))
{
    alert(txtTitle + "只能使用数字！");
    objDigit.focus();
    return false;
}
return true;
}
//Validate the form
function Validate(form)
{
var age = form.age;
if (! CheckDigit(age, "年龄")) return false;
var id = form.ID;
if (! CheckDigit(id, "身份证号码")) return false;
var mobile = form.moblie;
if (! CheckDigit(mobile, "手机号")) return false;
return true;
}

</script>

<body>
<form name=form1 method="post" onSubmit="return Validate(this);" action=register.jsp>
姓名：<input type="text" name="chinese_name" maxlength="10">
年龄：<input type="text" name="age" maxlength="5">
身份证：<input type="text" name="ID" maxlength="10">
手机：<input type="text" name="mobile" maxlength="10">
</form>
</body>
</html>
通过上面的例子，我们应该对数字类型的校验很有把握了。
然而，有一些特殊的信息，不仅仅需要判断它是否是纯数字，而且还需要进一步检验是否合乎规格。例如上面例子的身份证号码和手机号码，身份证号码要求是15位（老身份证）或18位（新身份证），手机号码要求是11位数字，且前面两位是13开头，因此专门为它们分别写两个校验的函数：
function CheckIDCard(objID)
{
var strID = objID.value;

if (strID.length != 15 && strID.length != 18)
{
    alert("身份证号只能为 15 位或 18 位数字，请重新输入！");
    objID.focus();
    return false;
}
return true;
}
function isValidMobile(objMobile){
    var mobile = objMobile.value;
    if ((mobile.length != 11) || isNaN(mobile) || (mobile.substring(0, 2) != "13")) {
      return false;
    }
    return true;
}
现在身份证号码和手机号的校验也搞定了，我们再回头看看关于“年龄”的校验。这个域虽然检查了填写的是否是纯数字，但这个并没有考虑是否是正数，因为负数和零这些值对年龄没有意义。下面的这个函数就用于判断正数的：
function CheckPositive(objDigit, txtTitle)
{
if(!CheckDigit(objDigit, txtTitle)) return false;
else
{
if(parseInt(objDigit.value)<0)
{
    alert(txtTitle + "不能使用负数！");
    objDigit.focus();
    return false;
}
}
return true;
}
我们再仔细想想，这样的校验就算是比较完美了么？是不是还有一些纰漏呢？应该想到小数也不能描述年龄，没有人会向别人介绍说我今年22.5岁。正整数的校验函数如下：
function isInteger(s){
var i;
for (i = 0; i < s.length; i++){
  var c = s.charAt(i);
  if (((c < "0") || (c > "9"))) return false;
}
return true;
}
这下终于圆满了。呵呵。

使用正则表达式

1、如何校验数字型?
var re=/^/d{1,8}$|/./d{1,2}$/;
var str=document.form1.all(i).value;
var r=str.match(re);
if (r==null)
{
sign=-4;
break;
}
else{
document.form1.all(i).value=parseFloat(str);
}