jquery手机号码正则验证

jquery手机号码正则验证<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><scripttype="text/javascript"src=&qu

大家好,又见面了,我是你们的朋友全栈君。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <style>
        .item-label{
            height: 30px;
            line-height:30px ;
            float: left;
        }
        input {
            height: 30px;
            line-height: 30px;
            background-color: transparent;
            text-align: right;
            width: 170px;
            padding: 0;
            font-size: 14px;
        }
        input::-webkit-input-placeholder {
            color: #999;
        ;
        }

        input::-moz-input-placeholder {
            color: #999;
        ;
        }

        input::-ms-input-placeholder {
            color: #999;
        ;
        }

        input::-o-input-placeholder {
            color: #999;
        ;
        }
    </style>
</head>
<body>
<label class="item-label">
    姓名:</label>
<div class="item-cont item-text">
    <input name="name" id="name" type="text" placeholder="请输入您的姓名">
</div>
<label class="item-label">
    手机:</label>
<div class="item-cont item-text">

    <input name="mobile" id="mobile" type="tel" placeholder="请输入您的电话" maxlength="11" >
</div>
<button class="btn">提交</button>
</body>
</html>
<script>
    //解决IE10以下的placeholder问题
    function placeholderSupport() {
        return 'placeholder' in document.createElement('input');
    }
    if (!placeholderSupport()) {   // 判断浏览器是否支持 placeholder
        $("[placeholder]").each(function () {
            var _this = $(this);
            var left = _this.css("padding-left");
            _this.parent().append('<span class="placeholder" data-type="placeholder" style="position:absolute;height: 30px;text-align: right;width:170px;line-height: 30px;left: ' + left + '">' + _this.attr("placeholder") + '</span>');
            if (_this.val() != "") {
                _this.parent().find("span.placeholder").hide();
            }
            else {
                _this.parent().find("span.placeholder").show();
            }
        }).on("focus", function () {
            $(this).parent().find("span.placeholder").hide();
        }).on("blur", function () {
            var _this = $(this);
            if (_this.val() != "") {
                _this.parent().find("span.placeholder").hide();
            }
            else {
                _this.parent().find("span.placeholder").show();
            }
        });
        // 点击表示placeholder的标签相当于触发input
        $("span.placeholder").on("click", function () {
            // console.log("11")
            $(this).hide();
            $(this).siblings("[placeholder]").trigger("click");
            $(this).siblings("[placeholder]").trigger("focus");
        });
    }
//    提交
    $('body') .on('click', '.btn', function () {
        var name1 = /^[\u4e00-\u9fa5\u4dae\uE863\-a-zA-Z]{1,50}$/; //中英文1到50字内,不带数字
        var name2 = /^(\w){1,}$/; //单个字母,重复字母
        var name3 = ['傻逼', '煞笔', '神经', '艳遇'];
        var name4 = /^[a-zA-Z-\s]+$/;//单个字母
        var mobilereg1 = /^1[3|5|6|7|8|9][0-9]{9}$/; // 1[356789][0-9] (后面再接8位数)
        var mobilereg2 = /^14[5|7][0-9]{8}$/; // 14[57] (后面再接8位数)
        var userName = $.trim($('#name').val());
        var mobile = $.trim($('#mobile').val());
        if (!userName) {
            alert('请填写姓名');
            return;
        } else if (!name1.test(userName)) {
            alert("您输入的姓名格式不正确,请重新输入");
            return;
        } else if (name2.test(userName.toLocaleLowerCase())) {// 大写字母转小写
            alert("您输入的姓名格式不正确,请重新输入");
            return;
        } else if (name3.indexOf(userName) > -1) {
            alert("您输入的姓名格式不正确,请重新输入");
            return;
        } else if (userName.length <= 1 && name4.test(userName)) {
            alert("您输入的姓名格式不正确,请重新输入");
            return;
        }
        if (!mobile) {
            alert('请填写手机号码');
            return;
        } else if (!mobilereg1.test(mobile) && !mobilereg2.test(mobile)) {
            alert('请填写正确的手机号码');
            return;
        }

    });
</script>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/132218.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 微信小程序:微信登陆(ThinkPHP作后台)

    微信小程序:微信登陆(ThinkPHP作后台)

    2021年10月14日
  • 102 二叉树层序遍历

    102 二叉树层序遍历层序遍历,每次层的输出是是一个一维数组,整个二叉树的输出结果是二维数组BFS遍历,依托于队列结构,每次在根节点出栈的时候,将其值加在结果列表中,然后将他的左右孩子节点入队列。层序遍历相对于BFS,需要知道每一层有多少个节点。因此,我们需要稍微修改一下代码,在每一层遍历开始前,先记录队列中的结点数量nn(也就是这一层的结点数量),然后一口气处理完这一层的n个结点。classSolution:deflevelOrder(self,root:TreeNode):.

  • Java开发手册之OOP规约

    Java开发手册之OOP规约Java开发手册之OOP规约

  • 高等数学导数公式、微分公式和积分公式大全[通俗易懂]

    高等数学导数公式、微分公式和积分公式大全感谢观看期待关注知乎:叄贰壹简书:带只拖鞋去流浪关注我,带你一起写bugwarning:未经授权,不得转载有问题的小伙伴请在下方留言,喜欢就点个赞吧…

  • 漂亮的复制零_一张图片有很多小图片组成

    漂亮的复制零_一张图片有很多小图片组成前言磁盘可以说是计算机系统最慢的硬件之一,读写速度相差内存10倍以上,所以针对优化磁盘的技术非常的多,比如零拷贝、直接I/O、异步I/O等等,这些优化的目的就是为了提高系统的吞吐量,另外操作系统内核中的磁盘高速缓存区,可以有效的减少磁盘的访问次数。这次,我们就以「文件传输」作为切入点,来分析I/O工作方式,以及如何优化传输文件的性能。正文为什么要有DMA技术?在没有DMA技术前,I/O的过程是这样的:CPU发出对应的指令给磁盘控制器,然后返回;磁盘控制器收到..

  • Postman :中文汉化界面一键配置「建议收藏」

    Postman :中文汉化界面一键配置「建议收藏」开心到飞起!!!Postman工具界面被大佬汉化啦!!Gitee和Github链接跳转地址:黄连木笛大佬的Gitee地址:PostmanCn黄连木笛大佬的Github地址:PostmanCn汉化包下载地址【2021-04-1320:22如有新版可以自己更新下载】:https://gitee.com//hlmd/PostmanCn/attach_files/670442/download/app.zip使用方法:解压并复制app文件夹到路径:C:/Users/用户名/AppData/Lo.

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号