用正则表达式完成简单的注册功能

如何验证注册时输入的内容，推荐使用正则表达式。
要求：
1、用户名输入框，正确的条件是：6-30位字母、数字或_， 以字母开头。
（1） 如果输入内容的不满足条件时，输入框后面的提示内容为。6-30位字母、数字或’_’，字母开头，且字体颜色变为红色。
（2） 如果输入的满足条件，输入框后面的提示内容为：“用户名输入正确”，且字体颜色变成绿色。
2、密码输入框，正确的条件是：6-20位字母或数字组成
（1） 如果输入内容的不满足条件时，输入框下面给出提示内容为：6-20位字母或数字，且字体颜色变为红色。
（2） 如果输入的密码内容是纯数字、纯小写字母或者纯大写字母，密码强度为低，只有第一块变为红色。
（3） 如果是两种类型的结合，那么密码强度为一般，第二块变为橘色。
（4） 如果是三种类型的结合，那么密码强度为高，第三块变为绿色。
3、密码确认框，正确的条件是：与上面的密码输入框的内容一致。
（1） 如果为空，那么后面给出文字提示“输入框不能为空”，且字体颜色变为红色。
（2） 如果输入的密码跟上面的密码不一致，则提示“两次密码输入不一致，请重新输入”且字体颜色变为红色。
（3） 如果输入的密码跟上面一致，则提示“两次输入一致”。
4、满足所有的验证条件，点击下一步提示“信息填写正确”，否则提示“请填写正确的信息”

HTML代码块
<div class="reg-wrap">
        <!-- 用户名 -->
        <div class="felid nameFelid">
            <div class="star">*</div>
            <div class="textBox">
                <div class="text">用户名:</div>
                <input type="text" name="" id="name" placeholder="用户名设置后不可修改">
            </div>

            <div class="tishi warning1">6-30位字母、数字或‘_’,字母开头;</div>
        </div>

        <!-- 登录密码 -->
        <div class="felid passwordFelid">
            <div class="star">*</div>
            <div class="textBox">
                <div class="text">登录密码:</div>
                <input type="password" name="" id="password" placeholder="6-30位字母或数字">
            </div>
            <div class="colorFelid">
                <div class="color red"></div>
                <div class="color yellow"></div>
                <div class="color green"></div>
            </div>
            <!--填错时出现的提示-->
            <div class="tishi warning2">请输入6-20位字母或数字</div>
        </div>

        <!-- 确认密码 -->
        <div class="felid passwordFelid2">
            <div class="star">*</div>
            <div class="textBox">
                <div class="text">确认密码:<