独家解密实现：百度账号注册用户名正则表达式验证规则

前言

最近有很多小伙伴问到，百度账户注册时用户名是如何进行校验的，用户名的正则表达式是如何定义的，针对小伙伴的问题，让我们一起来揭开那神秘的面纱...

谋定而后动

古人云：谋定而后动。我们先来观察百度账户注册时的场景，关于用户名的场景有一下几个：

1. 默认情况显示：

   

   用户名默认情况.png

2. 用户名中出现特殊字符

   

   用户名特殊字符.png

3. 用户名中纯数字

   

   用户名纯数字.png

4. 用户名长度

   

   用户名长度.png

5. 判断账户名是否可用

   此规则不再此次讨论范围内，判断账户名是否可用，应结合Ajax向后台服务器发送数据验证

由观察可得，百度账户注册时用户名的规则：

1. 用户名由中英文字符、下划线、数字组成，不能为纯数字
2. 用户名的长度不能超过7个汉字或14个英文字符

动起来...

很多小伙伴在遇到用户名注册开发时，都会想到正则表达式，都在考虑如果通过一个正则表达式来完成所有的约束。很多情况下都是OK的，但是在这里想通过一个正则表达式来完成所有的约束条件是非常有困难滴！(如果有哪位小伙伴，有一个正则表达式完成所有的需求，可留言评论、探讨...)

那对于百度注册用户名这个情况，我们需要如何去实现呢，小伙伴不要担心。就像追女朋友一样，直接上搞不定，那就迂回一下喽...

分解要求

对于百度账户注册的用户名规则，我们进行要求分解：

1. 判断用户名是否为空
2. 判断用户名中是否包含非法字符(除了中英文、数字、下划线以外的字符)
3. 判断用户名是纯数字(也就是除了数字以外是否还有其他字符)
4. 判断用户名的长度(遍历整个用户名字符串，是中文长度+2，否则长度+1)

聪明的小伙伴，看到这里是否你已经明白了呢...

代码实现

一切从简，重在理论

HTML部分

    
        
        
        
    
    
        

            用户名：


            
            
        
    

JS逻辑部分

综述

以上呢就是实现百度账户注册用户名的整个校验过程，小伙伴可以好好参考下思路是怎样的，代码是一步步的如何实现滴，在日常的开发中，账户注册验证是经常能预见到，希望各位小伙伴能触类旁通，窥一斑而知全豹。