比较旧的写法：验证车牌、手机号、电话、qq等

 

1、验证车牌代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>验证车牌</title>
    <style type="text/css">
    * {
        margin: 0;
        padding: 0
    }
    
    input {
        color: #333
    }
    </style>
</head>

<body>
    <form name="theform" onsubmit="return che2Cha('chepai');" method="post" action="haoma.php">
        <div>
            <select id="cp_dq" name="dq">
                <option value="京" selected="">京</option>
                <option value="津">津</option>
                <option value="沪">沪</option>
                <option value="渝">渝</option>
                <option value="冀">冀</option>
                <option value="豫">豫</option>
                <option value="云">云</option>
                <option value="辽">辽</option>
                <option value="黑">黑</option>
                <option value="湘">湘</option>
                <option value="皖">皖</option>
                <option value="鲁">鲁</option>
                <option value="新">新</option>
                <option value="苏">苏</option>
                <option value="浙">浙</option>
                <option value="赣">赣</option>
                <option value="鄂">鄂</option>
                <option value="桂">桂</option>
                <option value="甘">甘</option>
                <option value="晋">晋</option>
                <option value="蒙">蒙</option>
                <option value="陕">陕</option>
                <option value="吉">吉</option>
                <option value="闽">闽</option>
                <option value="贵">贵</option>
                <option value="粤">粤</option>
                <option value="青">青</option>
                <option value="藏">藏</option>
                <option value="川">川</option>
                <option value="宁">宁</option>
                <option value="琼">琼</option>
            </select>
            <select id="cp_zm" name="zm">
                <option value="A" selected="">A</option>
                <option value="B">B</option>
                <option value="C">C</option>
                <option value="D">D</option>
                <option value="E">E</option>
                <option value="F">F</option>
                <option value="G">G</option>
                <option value="H">H</option>
                <option value="I">I</option>
                <option value="J">J</option>
                <option value="K">K</option>
                <option value="L">L</option>
                <option value="M">M</option>
                <option value="N">N</option>
                <option value="O">O</option>
                <option value="P">P</option>
                <option value="Q">Q</option>
                <option value="R">R</option>
                <option value="S">S</option>
                <option value="T">T</option>
                <option value="U">U</option>
                <option value="V">V</option>
                <option value="W">W</option>
                <option value="X">X</option>
                <option value="Y">Y</option>
                <option value="Z">Z</option>
            </select>
            <input type="text" name="word" id="chepai_haoma_num" class="ipt_text">
            <input class="btn_orange_1" type="submit" value="查询">
        </div>
    </form>
</body>

</html>
<script type="text/javascript">
function che2Cha(t) {
    var num = document.getElementById(t + '_haoma_num').value;
    var diqu = document.getElementById('cp_dq').value;
    var zimu = document.getElementById('cp_zm').value;
    var flag = chkNum['chkchepai'](num);
    if (false == flag) {
        alert('请输入正确的号码');
        return false;
    }
    location.href = "/haoma/" + t + "/" + diqu + "-" + zimu + "-" + num;
}
var chkNum = {
    chkchepai: function(num) {
        if (num.search(/^[0-9a-zA-Z]{5}$/) == -1) {
            return false;
        }
        return true;
    }
}
</script>

效果图：

2.验证手机号码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    * {
        margin: 0;
        padding: 0
    }
    input{ color: #333 }
    </style>
</head>

<body>
    <form name="theform" onsubmit="return che2Cha('shouji');" method="post" action="haoma.php">
        <div>
            <input type="text" name="word" id="shouji_haoma_num" class="ipt_text">
            <input class="btn_orange_1" type="submit" value="查询">
        </div>
    </form>
</body>

</html>
<script type="text/javascript">
function che2Cha(t) {
    var num = document.getElementById(t + '_haoma_num').value;
    var flag = chkNum['chkshouji'](num);
    if (false == flag) {
        alert('请输入正确的号码');
        return false;
    }
    location.href = "/haoma/" + t + "/" + diqu + "-" + zimu + "-" + num;
}
var chkNum = {
   
    chkshouji: function(num) {
        if (num.search(/^[1-9]\d{10}$/) == -1) {
            return false;
        }
        return true;
    }
}
</script>

 3.验证电话

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>验证电话</title>
    <style type="text/css">
    * {
        margin: 0;
        padding: 0
    }
    input{ color: #333 }
    </style>
</head>

<body>
    <form name="theform" onsubmit="return che2Cha('dianhua');" method="post" action="haoma.php">
        <div>
            <input type="text" name="word" id="dianhua_haoma_num" placeholder="请输入正确的电话号码，不用加区号" class="ipt_text">
            <input class="btn_orange_1" type="submit" value="查询">
        </div>
    </form>
</body>

</html>
<script type="text/javascript">
function che2Cha(t) {
    var num = document.getElementById(t + '_haoma_num').value;
    var flag = chkNum['chkdianhua'](num);
    if (false == flag) {
        alert('请输入正确的号码');
        return false;
    }
    location.href = "/haoma/" + t + "/" + diqu + "-" + zimu + "-" + num;
}
var chkNum = {
    chkdianhua: function(num) {
        if (num.search(/^[1-9]\d{6,7}$/) == -1) {
            return false;
        }
        return true;
    }
}
</script>

4.验证qq

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    * {
        margin: 0;
        padding: 0
    }
    input{ color: #333 }
    </style>
</head>

<body>
    <form name="theform" onsubmit="return che2Cha('qq');" method="post" action="haoma.php">
        <div>
            <input type="text" name="word" id="qq_haoma_num" placeholder="请输入QQ号码" class="ipt_text">
            <input class="btn_orange_1" type="submit" value="查询">
        </div>
    </form>
</body>

</html>
<script type="text/javascript">
function che2Cha(t) {
    var num = document.getElementById(t + '_haoma_num').value;
    var flag = chkNum['chkqq'](num);
    if (false == flag) {
        alert('请输入正确的号码');
        return false;
    }
    location.href = "/haoma/" + t + "/" + diqu + "-" + zimu + "-" + num;
}
var chkNum = {
    chkqq: function(num) {
        if (num.search(/^[1-9]\d{4,12}$/) == -1) {
            return false;
        }
        return true;
    }
}
</script>

 5.验证身份证

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>验证身份证</title>
    <style type="text/css">
    * {
        margin: 0;
        padding: 0
    }
    
    input {
        color: #333
    }
    </style>
</head>

<body>
    <form name="theform" onsubmit="return che2Cha('shenfen');" method="post" action="haoma.php">
        <div>
            <input type="hidden" name="act" value="ok">
            <input type="hidden" name="type" value="6">
            <input type="text" name="word" id="shenfen_haoma_num" class="ipt_text">
            <input class="btn_orange_1" type="submit" value="查询">
        </div>
    </form>
</body>

</html>
<script type="text/javascript">
function che2Cha(t) {
    var num = document.getElementById(t + '_haoma_num').value;
    var flag = chkNum['chkshenfenzheng'](num);
    if (false == flag) {
        alert('请输入正确的号码');
        return false;
    }
    location.href = "/haoma/" + t + "/" + diqu + "-" + zimu + "-" + num;
}
var chkNum = {
    chkshenfenzheng: function(num) {
        if (num.search(/^[1-9](\d{14}|\d{16}[\d|x|X])$/) == -1) {
            return false;
        }
        return true;
    }
}
</script>

 验证汉字：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <form method="post" onclick="dingzi_next()">
        <input type="text" id="xing" value="请输入姓" >
        <button type="submit">提交</button>
    </form>
    <script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    function dingzi_next() {
        var str=$('#xing').val();
        var reg = /^[\u4E00-\u9FA5]+$/;
        if(!reg.test(str)){
            alert('请输入汉字');
            return false;
        }
        if(str.length>2){
            alert('姓只能1到2个汉字。');
            return false;
        }
        return true;
    }
</script>
</body>
</html>

效果图：

 

posted @ 2017-06-02 17:06  前端HL  阅读(392)  评论(0)  编辑  收藏  举报