AJAX实现增删改查

实例介绍

1.做一个网页，可以进行数据的增删改查的为佳
2.用pycharm工具建flask框架
3.按照MVC标准进行ajax前后端分离的代码
4.运行实现

代码分析
因为是MVC模式，所以有个dao包，有个controller包，有个service包，然后因为有些类需要重复使用，所以有个封装类的文件，在entity包里，pycharm中Flask框架生成的app文件，动态前端页面存在templates包中，静态前端页面和css、js、img等在static包中，由于引入了其他人的页面格式，将其也放在了static包中。

代码实现：

app.py:(启动文件及配置的所在)

from flask import Flask, render_template,session
import config
from config_class import *
from datetime import timedelta
from controller.usercontroller import usercontroller

app = Flask(__name__)
app.config['DEBUG'] = True
app.config['SECRET_KEY'] = 'AAAGGGGCCFDDDFFFDDDD'
app.config['PERMANENT_SESSION_LIFETIME'] = timedelta(minutes=30)  #设置session的保存时间。

# 是使用config py文件定义配置
app.config.from_object(config)
# 是使用class定义配置
app.config.from_object(DebugConfig)

app.register_blueprint(usercontroller)   # 声明

@app.route('/')  # URL路由
def index():
    print(session.get('user'))
    return render_template('index.html')

if __name__ == '__main__':
    app.run(host=app.config['SERVER_ADDR'], port=app.config['SERVER_PORT'], debug=True)
 

 

config.py:(可以在app.py中做配置，就不需要这个文件了)

'''
自定义配置文件
'''
DEBUG = True
SECRET_KEY = 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'
PAGE_SIZE = 10

SERVER_ADDR = '10.0.14.204'
SERVER_PORT = 80
 

 

usercontroller.py(创建.do事件，控制模型与页面视图一一对应)

from flask import Blueprint,render_template,request,session,Response
import hashlib
from service.userservice import UserService
from entity.user import User
import json

usercontroller = Blueprint('usercontroller', __name__)
userService = UserService()

@usercontroller.route("/gologin.do", methods=['POST', 'GET'])
def gologin():
    return render_template('login.html')

@usercontroller.route("/login.do", methods=['POST', 'GET'])
def login():
    userName = request.form.get('username')  # 表单提交的数据使用request.form[]
    userPwd = request.form.get('userpwd')
    print("login.do:",userName)
    result = userService.findUserByUserName(userName)
    print("login.do:",result)
    if result and  result[0][2] == userPwd:
        session['user'] = userName
        print(hashlib.md5('123456'.encode(encoding='utf-8')).hexdigest())
        # 登录成功，则保存Cookies信息
        resp = Response(render_template('index.html', messasge='登录成功'))
        resp.set_cookie('userName', userName, max_age=7*24*3600)
        resp.set_cookie('userPwd', userPwd, max_age=7*24*3600)
        return resp
        pass
    elif not result or  result[0][2] != userPwd:
        return render_template('login.html', message='用户名或密码错误')
        pass
    return render_template('login.html')
    pass

@usercontroller.route('/logout.do', methods=['POST', 'GET'])
def logout():
    session.clear()
    print('==========', session.get('user'))
    resp = Response(render_template('index.html'))
    resp.delete_cookie('userName')
    resp.delete_cookie('userPwd')
    return resp
    pass

@usercontroller.route('/goregist.do')
def goRegist():
    return render_template('regist.html')
    pass

@usercontroller.route('/regist.do', methods=['POST', 'GET'])
def regist():
    userName = request.form.get('userName')  # 表单提交的数据使用request.form[]
    userPwd = request.form.get('userPwd')

    user = User()
    user.userName = userName
    user.userPwd = userPwd

    result = userService.createUser(user)

    if result > 0:
        return render_template('login.html', message='注册成功')
        pass
    else:
        return render_template('regist.html', message='注册失败')
        pass
    pass

# 查询用户，并且显示
@usercontroller.route('/gouserinfo.do', methods=['POST', 'GET'])
def goUserInfo():
    userName = request.form.get('userName')
    userSex = request.form.get('userSex')
    user = User()
    user.userName = userName
    user.userSex = userSex
    userList = userService.findUserList(user)
    return render_template('systeminfo/userinfo.html', userList = userList, user=user)
    pass

# 删除用户，并且显示
@usercontroller.route('/removeruser.do', methods=['POST', 'GET'])
def goRemoveUser():
    userId = request.args.get('userId')
    userName = request.form.get('userName')
    userSex = request.form.get('userSex')
    user = User()
    user.userName = userName
    user.userSex = userSex
    result = userService.removeUser(userId)
    userList = userService.findUserList(user)
    return render_template('systeminfo/userinfo.html', userList = userList, message='删除成功' if result >0 else '删除失败')
    pass

@usercontroller.route('/gomodifyuser.do', methods=['POST', 'GET'])
def goModifyUser():
    userId = request.args.get('userId')
    user = userService.findUserByUserId(userId)
    return render_template('systeminfo/modifyuser.html', user=user)
    pass

@usercontroller.route('/gomodifysubmit.do', methods=['POST', 'GET'])
def goSubmitModifyUser():
    userId = request.form.get('userId')
    userName = request.form.get('userName')
    userSex = request.form.get('userSex')
    user = User()
    user.userName = userName
    user.userSex = userSex
    user.userId = userId

    result = userService.updateUser(user)
    userList = userService.findUserList(user)
    return render_template('systeminfo/userinfo.html', userList=userList, message='修改成功' if result > 0 else '修改失败')
    pass

@usercontroller.route('/checkusername.do', methods=['POST', 'GET'])
def checkUserName():
    userData = request.get_data()
    userDict = json.loads(userData)

    user = userService.findUserByUserName(userDict.get('userName'))
    dicts = {}
    if user:
        dicts = {'code':1}
        pass
    else:
        dicts = {'code':0}
        pass
    return json.dumps(dicts)
    pass

@usercontroller.route('/goajaxuserinfo.do', methods=['POST', 'GET'])
def goAjaxUserInfo():
    return render_template("systeminfo/userinfoajax.html")
    pass

@usercontroller.route('/ajaxuserinfo.do', methods=['POST', 'GET'])
def getUserInfo():
    userData = request.get_data()
    userDict = json.loads(userData)
    tData = {}

    user = User()
    user.userName = userDict.get('userName')
    user.userSex = userDict.get('userSex')

    currentPage = int(userDict.get('currentPage'))
    pageSize = int(userDict.get('pageSize'))
    opr = userDict.get('opr')
    userId = int(userDict.get('userId'))
    user.userId = userId

    delResult = 0
    if opr == 'del':
        delResult = userService.removeUser(userId)
        pass
    elif opr == 'update':
        tUser = userService.findUserByUserId(userId)
        tData['userId'] = tUser.userId
        tData['userName'] = tUser.userName
        tData['userSex'] = tUser.userSex
        returnData = {'code': 1, 'userData': tData, 'pageSize': pageSize, 'currentPage': currentPage, 'opr':'update'}

        return json.dumps(returnData)
    elif opr == 'submitUpdate':
        userService.updateUser(user)
        pass

    result = userService.findPageUserList(user, pageSize, currentPage)
    counts = userService.countUsers(user)
    totalPage = 0

    if(counts%pageSize == 0):
        totalPage = counts//pageSize
    else:
        totalPage = counts // pageSize + 1
        pass

    returnData = {'code':1, 'userData':result, 'pageSize':pageSize, 'currentPage':currentPage, 'totalPage':totalPage, 'delcode':delResult, 'opr':'search','counts':counts}

    return json.dumps(returnData)
    pass
 

 

userdao.py(,dao包其他文件可直接使用，主要是与数据库建立连接)

from .basedao import BaseDao

class UserDao(BaseDao):

    def findUserByUserName(self, userName):
        try:
            sql = "select * from t_user where user_name=%s"
            self.getConnection()
            self.execute(sql, (userName,))
            result = self.fetch()
        finally:
            self.close()

        return result
        pass

    def createUser(self, user):
        try:
            sql = "insert into t_user (user_name, user_pwd) values(%s, %s)"
            self.getConnection()
            result = self.execute(sql, (user.userName, user.userPwd))
            self.commit() # 执行了sql语句之后要commit
            return result
        finally:
            self.close()
            pass
        pass

    def findUserList(self, user):
        try:
            params = []
            # sql语句和params就需要是动态
            sql = "select * from t_user where 1=1 " #  where 1=1是为了便于增加and
            if user.userName:
                sql += " and user_name like %s "  # 模糊查询
                params.append('%'+user.userName + '%')
                pass
            if user.userSex:
                sql += " and user_sex=%s"
                params.append(user.userSex)
                pass
            self.getConnection()
            self.execute(sql, params)
            result = self.fetch()
        finally:
            self.close()

        return result
        pass

    def removeUser(self, userId):
        try:
            sql = "delete from t_user where user_id=%s"
            self.getConnection()
            result = self.execute(sql, (userId, ))
            self.commit()  # 执行了sql语句之后要commit
            return result
        finally:
            self.close()
            pass
        pass

    def findUserByUserId(self, userId):
        try:
            sql = "select * from t_user where user_id=%s"
            self.getConnection()
            self.execute(sql, (userId,))
            result = self.fetch()
        finally:
            self.close()

        return result
        pass

    def updateUser(self, user):
        try:
            sql = "update t_user set user_sex=%s where user_id=%s"
            self.getConnection()
            result = self.execute(sql, (user.userSex, user.userId))
            self.commit()  # 执行了sql语句之后要commit
            return result
        finally:
            self.close()
            pass
        pass

    def findPageUserList(self, user, pageSize, currentPage):
        try:
            params = []
            # sql语句和params就需要是动态
            sql = "select * from t_user where 1=1 "  # where 1=1是为了便于增加and
            if user.userName:
                sql += " and user_name like %s "  # 模糊查询
                params.append('%' + user.userName + '%')
                pass
            if user.userSex:
                sql += " and user_sex=%s"
                params.append(user.userSex)
                pass

            startRow = (currentPage - 1)*pageSize

            sql += "limit %s, %s"
            params.append(startRow)
            params.append(pageSize)

            self.getConnection()
            self.execute(sql, params)
            result = self.fetch()
        finally:
            self.close()

        return result
        pass

    def countUsers(self, user):
        params = []
        # sql语句和params就需要是动态
        sql = "select count(*) from t_user where 1=1 "  # where 1=1是为了便于增加and
        if user.userName:
            sql += " and user_name like %s "  # 模糊查询
            params.append('%' + user.userName + '%')
            pass
        if user.userSex:
            sql += " and user_sex=%s"
            params.append(user.userSex)
            pass

        self.getConnection()
        self.execute(sql, params)
        result = self.fetchOne()
        return result
        pass
    pass
 

 

user.py(封装数据类)

# 封装数据类 VO：value object  entity 类
class User():
    def __init__(self):
        self.__userId = None
        self.__userName = None
        self.__userPwd = None
        self.__userSex = None
        pass

    @property
    def userId(self):
        return self.__userId
        pass

    @userId.setter
    def userId(self, userId):
        self.__userId = userId
        pass

    @property
    def userName(self):
        return self.__userName
        pass

    @userName.setter
    def userName(self, userName):
        self.__userName = userName
        pass

    @property
    def userPwd(self):
        return self.__userPwd
        pass

    @userPwd.setter
    def userPwd(self, userPwd):
        self.__userPwd = userPwd
        pass

    @property
    def userSex(self):
        return self.__userSex
        pass

    @userSex.setter
    def userSex(self, userSex):
        self.__userSex = userSex
        pass
    pass
 

 

userservise.py(无实意，主要与userdao.py一一对应)

from dao.userdao import UserDao
from entity.user import User

class UserService:

    def findUserByUserName(self, userName):
        userDao = UserDao()
        return userDao.findUserByUserName(userName)
        pass

    def createUser(self, user):
        userDao = UserDao()
        return userDao.createUser(user)
        pass

    def findUserList(self, user):
        userDao = UserDao()
        userlist = []
        result = userDao.findUserList(user)
        for temp in result:
            tuser = User()
            tuser.userId = temp[0]
            tuser.userName = temp[1]
            tuser.userSex = temp[4]
            userlist.append(tuser)
            pass
        return userlist
        pass

    def removeUser(self, userId):
        userDao = UserDao()
        return userDao.removeUser(userId)
        pass

    def findUserByUserId(self, userId):
        userDao = UserDao()
        result = userDao.findUserByUserId(userId)
        user = None
        if result:
            user = User()
            user.userId = result[0][0]
            user.userName = result[0][1]
            user.userSex = result[0][4]
            pass
        return user
        pass

    # 修改用户信息
    def updateUser(self, user):
        userDao = UserDao()
        return userDao.updateUser(user)
        pass

    def findPageUserList(self, user, pageSize, currentPage):
        userDao = UserDao()
        return userDao.findPageUserList(user, pageSize, currentPage)
        pass

    def countUsers(self, user):
        userDao = UserDao()
        return userDao.countUsers(user)[0]
        pass
    pass
 

 

modifyuser.html(修改页面)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改用户</title></title>
    <link rel="stylesheet" href="{{ url_for('static',filename='css/style.css') }}" />
    <script type="text/javascript" src="{{ url_for('static',filename='js/jquery-3.2.1.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='js/formvalidator.js') }}"></script>
</head>
<body>
    <form  name="userForm">

        <table align="center">
            <span color="red">{{ message }}</span>
            <input type="hidden" name="userId" value="{{ user.userId }}" />
            <tr>
                <td>用户名:</td><td><input type="text" name="userName" value="{{ user.userName }}"/><span id="userName"></span></td>
            </tr>
            <tr>
                <td>用户性别:</td><td><input type="text" name="userSex" value="{{ user.userSex }}"/></td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="reset" value="重置" />
                    <input type="button" value="修改" οnclick="submitModifyUser()"/>
                </td>
            </tr>

        </table>
    </form>
</body>
</html>

 

userinfo.html(用户信息页面)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <script type="text/javascript" src="{{ url_for('static',filename='js/jquery-3.2.1.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='js/formvalidator.js') }}"></script>
</head>
<body>
<form action="/gouserinfo.do" method="post">
    用户名：<input type="text" name="userName" />
    性别：<input type="text" name="userSex" />
            <input type="submit" value="查询">
</form>

<table align="center">
    <caption>{{ message }}</caption>
    <thead>
        <tr>
            <th>
                <input type="button" value="全选"/>
                <input type="button" value="反选"/>
            </th>
             <th>用户ID</th>
             <th>用户名</th>
             <th>用户性别</th>
             <th>操作</th>
        </tr>
    </thead>
    <tbody>
        {% for user in  userList %}
        <tr>
            <td align="center"><input type="checkbox" name="userId" value="{{ user.userId }}" /></td>
            <td>{{ user.userId }}</td>
            <td>{{ user.userName }}</td>
            <td>{{ user.userSex }}</td>
            <td>
                <a href="javascript:submitRemoveUser('{{ user.userId }}')">删除</a>&nbsp;&nbsp;
                <a href="/gomodifyuser.do?userId={{ user.userId }}">修改</a>
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>
</body>
</html>

 

userinfoajax.html(ajax版用户信息页面)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <link rel="stylesheet" href="{{ url_for('static',filename='bootstrap/dist/css/bootstrap.min.css') }}"/>
    <!-- Font Awesome -->
    <link rel="stylesheet" href="{{ url_for('static',filename='font-awesome/css/font-awesome.min.css') }}"/>
    <!-- Ionicons -->
    <link rel="stylesheet" href="{{ url_for('static',filename='bower_components/Ionicons/css/ionicons.min.css') }}"/>
    <!-- Theme style -->
    <link rel="stylesheet"  href="{{ url_for('static',filename='css/AdminLTE.css') }}" />
    <link rel="stylesheet"  href="{{ url_for('static',filename='css/style.css') }}" />
    <script type="text/javascript" src="{{ url_for('static',filename='js/jquery-3.2.1.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='js/formvalidator.js') }}"></script>
    <!-- Bootstrap 3.3.7 -->
    <script src="{{ url_for('static', filename='bootstrap/dist/js/bootstrap.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='js/userdata.js') }}"></script>
</head>
<body>
<div id="searchBox">
    <form method="post" name="searchForm">
        用户名：<input type="text" name="userName" />
        性别：  <input type="text" name="userSex" />
                <input type="hidden" name="currentPage" value="1"/>
                <input type="hidden" name="pageSize" value="10"/>
                <input type="button" value="查询" οnclick="getUserData(1, 10, 'search', 0)">
    </form>
    <table class="dataTable">
        <caption>{{ message }}</caption>
        <thead>
            <tr>
                <th align="center">
                    <input type="button" value="全选"/>
                    <input type="button" value="反选"/>
                </th>
                 <th>用户ID</th>
                 <th>用户名</th>
                 <th>用户性别</th>
                 <th>操作</th>
            </tr>
        </thead>
        <tbody id="dataBody">
        </tbody>
    </table>
    <div class="modal fade" id="modal-default">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">修改用户信息</h4>
              </div>
              <div class="modal-body">
                     <form method="post" name="userForm">
                         用户名：<input type="text" name="userName" />
                         性别：  <input type="text" name="userSex" />
                        <input type="hidden" name="userId"/>
                        <input type="hidden" name="currentPage" value="1"/>
                        <input type="hidden" name="pageSize" value="10"/>
                    </form>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" οnclick="getUserData(1, 10, 'submitUpdate', 0)">保存</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
</div>
</body>
</html>

 

index.html(主页面)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>职位分析系统主页</title>
         <script type="text/javascript" src="{{ url_for('static',filename='js/jquery-3.2.1.min.js') }}"></script>
            <script type="text/javascript" src="{{ url_for('static',filename='js/formvalidator.js') }}"></script>
        <script type="text/javascript">
        </script>
        <style type="text/css">
            a{
                margin-right: 12px;
            }
        </style>
    </head>
    <body style="min-width:1200px;padding: 0px;margin: 0;background-color: lavenderblush;">
        <div id="header" style="width: 100%;margin: 0px;padding: 0px;height: 40px;border: solid 0px red;background-color: white; ">
            <div style="width: 90%;border: solid 0px red;margin-left: 5%;padding: 6px;" align="left">
                <div  style="border: solid 0px red;padding: 0px;float: left"></div>
                <div  style="border: solid 0px red;padding: 0px;float: right">
                    {% if session.get('user') == None  %}
                          <a href="/gologin.do">登录  </a>&nbsp;&nbsp;&nbsp;&nbsp;
                          <a href="/goregist.do">注册  </a>
                    {% elif session.get('user') != None %}
                        {{ session.get('user') }}
                        <a href="/logout.do">注销</a>
                    {% endif %}
                </div>
            </div>
        </div>
        <div id='main' style="width: 90%;border: solid 0px red;margin-left: 5%;" align="center">
            <div id='left' style="min-height:800px;background-color: white;width: 14%;float:left;border: solid 0px red;margin: 4px;">
                <ul>
                    <li><a href="/goajaxuserinfo.do">用户信息管理</a></li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    <li>人工智能</li>
                    
                </ul>
            </div>
            <div id='middle' style="min-height:800px;background-color: white;width: 60%;float:left;border: solid 0px red;margin: 4px;">
                <div style="width: 100%;">
                    a
                    <!--
                    <iframe border="0" scrolling="no" width="100%" height="800px" name="innerFrame" src="html_form.html"></iframe>
                    -->
                </div>
            </div>
            <div id='right' style="min-height:800px;background-color: white;width: 24%;float:right;border: solid 0px red;margin: 4px;">
                <div style="width: 100%;">aaaa</div>
            </div>
        </div>
        <div style="background-color: #FF0000;position: fixed;left: 8px;top:200px;height: 400px;">
            左广告
        </div>
        <div style="background-color: #FF0000;position: fixed;right: 8px;top:200px;height: 400px;">
            右广告
        </div>
    </body>
</html>

 

login.html(登陆界面)

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>登录</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.7 -->
  <link rel="stylesheet" href="static/bootstrap/dist/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="static/font-awesome/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="static/bower_components/Ionicons/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="static/css/AdminLTE.css">
    <!-- jQuery 3 -->
<script src="static/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap 3.3.7 -->
<script src="static/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="{{ url_for('static',filename='js/jquery-3.2.1.min.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static',filename='js/formvalidator.js') }}"></script>

  </head>
<body class="hold-transition login-page">
<div class="login-box">
  <div class="login-logo">
    <a href="#">职位数据分析平台</a>
  </div>
  <!-- /.login-logo -->
  <div class="login-box-body">
    <p class="login-box-msg">亲，请登录:{{ message }}</p>

    <form action="/login.do" method="post">
      <div class="form-group has-feedback">
        <input type="text" class="form-control" name="username" placeholder="用户名">
        <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
      </div>
      <div class="form-group has-feedback">
        <input type="password" class="form-control" name="userpwd" placeholder="密码">
        <span class="glyphicon glyphicon-lock form-control-feedback"></span>
      </div>
      <div class="row">
        <div class="col-xs-8">
          <div class="checkbox icheck">
            <label>
              <input type="checkbox"> 记住密码
            </label>
          </div>
        </div>
        <!-- /.col -->
        <div class="col-xs-4">
          <button type="submit" class="btn btn-primary btn-block btn-flat" οnblur="checkLoginForm()">登录</button>
        </div>
        <!-- /.col -->
      </div>
    </form>

    <div class="social-auth-links text-center">
      <p></p>
      <a href="#" class="btn btn-block btn-social btn-primary btn-flat"><i class="fa  fa-qq"></i> 使用QQ登录</a>
      <a href="#" class="btn btn-block btn-social btn-success btn-flat"><i class="fa  fa-weixin"></i> 使用微信登录</a>
    </div>
    <!-- /.social-auth-links -->

    <a href="#">忘记密码</a><br>
    <a href="/goregist.do" class="text-center">注册新用户</a>

  </div>
  <!-- /.login-box-body -->
</div>
<!-- /.login-box -->

</body>
</html>

 

regist.html(注册界面)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册用户</title>
    <link rel="stylesheet" href="{{ url_for('static',filename='css/style.css') }}" />
    <script type="text/javascript" src="{{ url_for('static',filename='js/jquery-3.2.1.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='js/formvalidator.js') }}"></script>
</head>
<body>
    <form action="/regist.do" name="regForm" method="post" οnsubmit="return checkRegistForm()">
        <input type="hidden" name="result"  value="false"/>
        <table align="center">
            <span color="red">{{ message }}</span>
            <tr>
                <td>用户名:</td><td><input type="text" name="userName" value=""  οnblur="checkUserName()" /><span id="userName"></span></td>
            </tr>
            <tr>
                <td>密码:</td><td><input type="password" name="userPwd" value=""/></td>
            </tr>
            <tr>
                <td>重复密码:</td><td><input type="password" name="reUserPwd" value=""/><span id="reUserPwd"></span></td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="reset" value="重置" />
                    <input type="submit" value="注册" />
                </td>
            </tr>

        </table>
    </form>
</body>
</html>