完成注册功能

1.js文件： onclick函数return True时才提交表单，return False时不提交表单。

function fnregister() {
            var testName=document.getElementById("username")
            var errorName=document.getElementById("errorName")
            var testPassWord=document.getElementById("userpassword")
            var errorPassWord=document.getElementById("errorPassWord")

            var judgement=true;
     
            errorName.innerHTML = "<br>";
            errorPassWord.innerHTML = "<br>";

           if (testName.value.length < 6||testName.value.length > 12) {
                errorName.innerHTML = "用户名必须是6-12位";
                judgement=false
               return judgement
            }
           else if ((testName.value.charCodeAt(0) >= 48) && (testName.value.charCodeAt(0) <= 57)) {
                errorName.innerHTML = "用户名首字母不能为数字";
                judgement=false
               return judgement
            }

           else for (var i=0; i< testName.value.length; i++) {
                    if (((testName.value.charCodeAt(i) < 48) || (testName.value.charCodeAt(i) > 57)) && ((testName.value.charCodeAt(i) < 97) || (testName.value.charCodeAt(i) > 122))) {
                        errorName.innerHTML = "用户名只能包含字母和数字";
                        judgement=false
                        return judgement
                    }

                }
     
            var testPassWord2=document.getElementById("again")

            var error=document.getElementById("errorRegister")

            if (testPassWord.value.length < 6||testPassWord2.value.length > 12) {
               errorPassWord.innerHTML = "密码应为6-12位";
               judgement=false
               return judgement
            }
            else if(testPassWord1.value==testPassWord2.value){
                error.innerHTML = "注册成功";
                return judgement
            }
            else{
                error.innerHTML = "两次输入的密码不一致";
                judgement=false
                return judgement
            }
        }

　　

　　

2.html文件：

a.<form>中设置 action和method="post"

b.<input> 中设置 name

<form action="{{ url_for('login1') }}" method="post">
           <div class="inputStyle">
            <input class="inputFramework" type="text" id="username" name="username" placeholder="请输入用户名">
           </div>

           <div class="inputStyle">
            <input class="inputFramework" type="password" id="regisPassWord" name="password" placeholder="请输入您的密码">
           </div>

            <div class="inputStyle">
            <input class="inputFramework" type="password" id="again" placeholder="请再次输入您的密码">
           </div>

           <div>
                <br>
               <label><input id="loginButton" type="button" value="注册" onclick="fnregister();"/></label>
           </div>

           <div class="errorBox" id="errorRegister">
           </div>
     </form>

　　

　　

3.主py文件中：

a.from flask import  request, redirect, url_for

b.@app.route('/regist/', methods=['GET', 'POST’])

def regist():

   if request.method == 'GET':

        return render_template('regist.html')

   else:

        username = request.form.get(‘username’)#获取form中的数据

        判断用户名是否存在

        存到数据库中

        redirect重定向到登录页

@app.route('/register/',methods=['GET','POST'])
def register():
    if request.method=="GET":
        return render_template("register.html")
    else:
        username=request.form.get("username")
        password=request.form.get("password")
        user=User.query.filter(User.username==username).first()
        if user:
            return 'username existed'
        else:
            user = User(username='mavenlon', password='666666')
            db.session.add(user)
            db.session.commit()
            return redirect(url_for('login'))