tp-from表单的验证

这里记录的是,我每次会出现的问题了。如果我单个单个的验证input用户是否有进行输入,可以采取同事的做法,其实我之前也有写其他的,只是我觉得这个相对简洁些。
忘记了,里面包括了一个完整的ajax实例

 <script type="text/javascript">
    $('input[type=text],input[type=tel]').on('focus',function(){
        $(this).select();
    });

    $('#saveUserInfo').on('click',function(){
        username = $('input[name="username"]').val().trim();
        sex = $('select[name="sex"] option').not(function(){ return !this.selected }).val().trim();
        age = $('input[name="age"]').val().trim();
        mobile = $('input[name="mobile"]').val().trim();
        pro = $('select[name="pro"] option').not(function(){ return !this.selected }).val().trim();
        city = $('select[name="city"] option').not(function(){ return !this.selected }).val().trim();
        area = $('select[name="area"] option').not(function(){ return !this.selected }).val().trim();
        addr = $('input[name="addr"]').val().trim();

        if('' == username) {
            showTips("姓名不能为空");
            $('input[name=username]').focus();
            return false;
        }

        if(funIllegalChar(username)) {
            showTips("姓名存在特殊字符");
            $('input[name=username]').select();
            return false;
        }

        if(''!== mobile && !funRegMobile(mobile)) {
            showTips("电话号码格式不正确");
            $('input[name=mobile]').focus();
            return false;
        }
        $.ajax({
            url: "{:U('Ajax/setUserInfo')}",// 跳转到 action
            type: 'post',
            cache: false,
            async: true, /*true异步执行,false*/
            data: {'username':username,'sex':sex,'age':age,'mobile':mobile,'pro':pro,'city':city,'area':area,'addr':addr},
            dataType: 'HTML',
            timeout:8000,
            beforeSend:function(){ showDoAjaxTips();},
            success:function(data) {
                result = $.parseJSON(data);
                showTips(result.MSG);
                return false;
            },
            error : function(xmlHttpRequest, error) {
                if( error=='timeout'){ //超时
                    showTips("网络太差!");
                } else {
                    showTips("系统错误!");
                }
            }
        });
        return false;
    });
</script>

上部分是同事写的,这边是我写的。

<script>
    $(function(){
        //初始化地址
        $pro = "<?php echo $res['pro'] ?>";
        $city = "<?php echo $res['city']  ?>";
        $area = "<?php echo $res['area'] ?>";
        if($pro != ""){
            update($pro,$city,$area);
        }
        $(".cqrcode").click(function(){
            if($("#qrcodeurl").val() == ''){
                $.get("/index.php?s=/Home/Base/wx_cQrcode.html",function(data,status){
                    $data = $.parseJSON(data);
                    $url = $data.url;
                    $qrid = $data.id;
                    $("#qrcodeurl").val($url);
                    $("#qid").val($qrid);
                    $("#qrcode").attr('src',$url);
                    $("#qrcode").attr('style',"");
                });
                /*var oDocumentH = $('body').height() + 200;
                window.parent.document.getElementById('contentIframe').style.height = oDocumentH + 'px';*/
            }else{
                tusi("二维码已生成,无需替换");
            }

        })
    })
    function typeP(){
        $password = $("#ps").val();
        $("#password").val(calcMD5($password));

        if($("#qrcodeurl").val() == ""){
            tusi("请点击生成二维码")
            return false;
        }
        return true;
    }


    /*提交做检查 -----------------------------*/
    $("#shopname").blur(function(){
        var thename = $("input[name='shopname']").val();
        if($("input[name='shopname']").val() == ''){
            $("#shopname").css('border-color','red');
            $("#shopname_one").html("* 门店名不能为空,请认真填写。").css('color','red');
            return false;
        }else{
            $("#shopname").css('border-color','');
            $("#shopname_one").html("* ").css('color','');
        }
    })

    $("#un").blur(function(){
        var un = $("input[name='un']").val();
        if($("input[name='un']").val() == ''){
            $("#un").css('border-color','red');
            $("#un_one").html("* 账号不能为空,请认真填写。").css('color','red');
            return false;
        }else if(!checkUser(un.Trim())){
            $("#un").css('border-color','red');
            $("#un_one").html("* 不可用,请以字母、数字、下划线组成,字母开头,4-16位。").css('color','red');
            return false;
        }else{
            $("#un").css('border-color','');
            $("#un_one").html("* ").css('color','');
        }
    })


    $("#pw").blur(function(){
        var pw = $("input[name='pw']").val();
        if( pw == ''){
            $("#pw").css('border-color','red');
            $("#pw_one").html("* 密码不能为空,请认真填写。").css('color','red');
            return false;
        }else if(5 > pw.length){
            $("#pw").css('border-color','red');
            $("#pw_one").html("* 密码至少大于等于6位").css('color','red');
            return false;
        }else{
            $("#pw").css('border-color','');
            $("#pw_one").html("* ").css('color','');
        }
    })

    $("#agin_pass").blur(function(){
        var pw = $("input[name='pw']").val();
        if($("input[name='agin_pass']").val() == ''){
            $("#agin_pass").css('border-color','red');
            $("#agin_pass_one").html("* 确认密码不能为空,请认真填写。").css('color','red');
            return false;
        }else if(pw != $("input[name='agin_pass']").val()){
            $("#agin_pass").css('border-color','red');
            $("#agin_pass_one").html("* 两次密码不一致,请重新输入").css('color','red');
            return false;
        }else{
            $("#agin_pass").css('border-color','');
            $("#agin_pass_one").html("* ").css('color','');
        }
    })




    $("#theforn").click(function(){
        var pw = $("input[name='pw']").val();
        var un = $("input[name='un']").val();
        if($("input[name='shopname']").val() == ''){
            $("#shopname").focus().css('border-color','red');
            $("#shopname_one").html("* 门店名不能为空,请认真填写。").css('color','red');
            return false;
        }else if(un == ''){
            $("#un").focus().css('border-color','red');
            $("#un_one").html("* 账号不能为空,请认真填写。").css('color','red');
            return false;
        }else if(!checkUser(un.Trim())){
            $("#un").focus().css('border-color','red');
            $("#un_one").html("* 不可用,请以字母、数字、下划线组成,字母开头,4-16位。").css('color','red');
            return false;
        }else if( pw == ''){
            $("#pw").focus().css('border-color','red');
            $("#pw_one").html("* 密码不能为空,请认真填写。").css('color','red');
            return false;
        }else if(5>pw.length){
            $("#pw").focus().css('border-color','red');
            $("#pw_one").html("* 密码至少大于等于6位").css('color','red');
            return false;
        }else if($("input[name='agin_pass']").val() == ''){
            $("#agin_pass").focus().css('border-color','red');
            $("#agin_pass_one").html("* 确认密码不能为空,请认真填写。").css('color','red');
            return false;
        }else if(pw != $("input[name='agin_pass']").val()){
            $("#agin_pass").focus().css('border-color','red');
            $("#agin_pass_one").html("* 两次密码不一致,请重新输入").css('color','red');
            return false;
        }else{
            document.getElementById('form1').submit();
        }

    })

    function checkUser(str){
        var re = /^[a-zA-z]\w{3,15}$/;
        return re.test(str);
    }

    String.prototype.Trim = function()
    {
        return this.replace(/(^\s*)|(\s*$)/g, "");
    }

</script>

其实是我懒。。。呵呵哒。。本来可以删掉一些,但是我懒。

2015/12/23 这是今天在网上找到的。关于手机号码跟座机号码的验证了。

/*(1)电话号码由数字、"("、")"和"-"构成
    (2)电话号码为3到8位
    (3)如果电话号码中包含有区号,那么区号为三位或四位
    (4)区号用"("、")"或"-"和其他部分隔开
    (5)移动电话号码为11或12位,如果为12位,那么第一位为0
    (6)11位移动电话号码的第一位和第二位为"13"
    (7)12位移动电话号码的第二位和第三位为"13"*/
    function IsTelephone(obj)// 正则判断
    {
        var pattern=/(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/;
        if(pattern.test(obj))
        {
            return true;
        }
        else
        {
            return false;
        }
    }




    String.prototype.Trim = function() {
        var m = this.match(/^\s*(\S+(\s+\S+)*)\s*$/);
        return (m == null) ? "" : m[1];
    }
    String.prototype.isMobile = function() {
        return (/^(?:13\d|15[89])-?\d{5}(\d{3}|\*{3})$/.test(this.Trim()));
    }
    String.prototype.isTel = function()
    {
        //"兼容格式: 国家代码(2到3位)-区号(2到3位)-电话号码(7到8位)-分机号(3位)"
        //return (/^(([0\+]\d{2,3}-)?(0\d{2,3})-)?(\d{7,8})(-(\d{3,}))?$/.test(this.Trim()));
        return (/^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$/.test(this.Trim()));
    }
    function chkForm(obj) {
        if (obj.isMobile()||obj.isTel()) {
            obj = obj.Trim();
            return true;
        }else {
            return false;
        }
    }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值