开始Flask项目

  1. 新建Flask项目。
  2. 设置调试模式。
  3. 理解Flask项目主程序。
  4. 使用装饰器,设置路径与函数之间的关系。
  5. 使用Flask中render_template,用不同的路径,返回首页、登录员、注册页。
  6. 用视图函数反转得到URL,{{url_for(‘login’)}},完成导航条里的链接。
    from flask import Flask,render_template
    
    app = Flask(__name__)
    
    
    @app.route('/')
    def index():
        return render_template('index.html')
    @app.route('/login/')
    def login():
        return render_template('login.html')
    @app.route('/register/')
    def register():
        return render_template('register.html')
    
    if __name__ == '__main__':
        app.run(debug=True)
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <h1 align="center">mis问答平台<span style="font-size: larger";></span></h1>
    <h2 align="center">广州商学院界面</h2>
    <style type="text/css">
         p{
                color: red;
            }
            h2{
         background-color: cyan;
            }
            .textyellow{
                color: blue;
                       }
            #tt{
                color: yellow;
            }
    </style>
    
    <nav>
        <img src="http://www.gzcc.cn/2016/images/banner.png" width="258" height="39" alt="gzcc.cn"><br>
        <a href="">首页</a>
        <a href="">下载APP</a>
        <input type="text"name="search"placeholder="输入内容">
        <button type="submit">搜索</button>
        <a href="login.html">登录</a>
        <a href="register.html">注册</a>
        </nav>
    </body>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>用户提示</title>
     <link rel="stylesheet" type="text/css" href="../aa/css/1.css">
    
    <body>
    <div class="bigbox">
          <div class="box">
              <h2 align="center">登录</h2>
    
           <div class="input_box" align="center">
               账户:<input id="umane"type="text"placeholder="请输入用户名">
           </div>
            <div class="input_box" align="center">
               密码:<input id="upass"type="password"placeholder="请输入密码">
           </div>
              <div id="error_box"><br></div>
              <div class="input_box" align="center">
                  <button onclick="myLogin()">登录</button>
                   <button onclick=window.alert("是否取消登录?")>取消</button></div>
              </div>
                   </div>
    <script>function myLogin() {
                var oUname = document.getElementById("umane");
                var oError = document.getElementById("error_box");
                 var oUpass = document.getElementById("upass");
                oError.innerHTML = "<br>"
         //oUname
            if (oUname.value.length>12 || oUname.value.length<6){
                oError.innerHTML = "name:6-12";
                return;
             } else if((oUname.value.charCodeAt(0)>=48) && oUname.value.charCodeAt(0)<=57){
    
                oError.innerHTML = "首字母不能是数字";
                return;
            }else for(var i=0; i<oUname.value.length;i++)
            {
    
         if((oUname.value.charCodeAt(i)<48 || oUname.value.charCodeAt(i)>57)&&(oUname.value.charCodeAt(i)<97 || oUname.value.charCodeAt(i)>122 )){
                        oError.innerHTML = "只能包含字母和数字";
                        return;
                    }
                }
    
    
                if(upass.value.length>12 || upass.value.length<6){
                    oError.innerHTML="password;6-12";
                    return;
                }
                window.alert("登陆成功 !")
    
            }
            </script>
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>用户注册</title>
     <link rel="stylesheet" type="text/css" href="../aa/css/1.css">
        <script>function myLogin() {
                var oUname = document.getElementById("umane");
                var oError = document.getElementById("error_box");
                 var oUpass = document.getElementById("upass");
                oError.innerHTML = "<br>"
         //oUname
            if (oUname.value.length>12 || oUname.value.length<6){
                oError.innerHTML = "name:6-12";
                return;
             } else if((oUname.value.charCodeAt(0)>=48) && oUname.value.charCodeAt(0)<=57){
    
                oError.innerHTML = "首字母不能是数字";
                return;
            }else for(var i=0; i<oUname.value.length;i++)
            {
    
         if((oUname.value.charCodeAt(i)<48 || oUname.value.charCodeAt(i)>57)&&(oUname.value.charCodeAt(i)<97 || oUname.value.charCodeAt(i)>122 )){
                        oError.innerHTML = "只能包含字母和数字";
                        return;
                    }
                }
    
    
                if(upass.value.length>12 || upass.value.length<6){
                    oError.innerHTML="password;6-12";
                    return;
                }
                window.alert("登陆成功 !")
    
            }</script>
    </head>
    <body>
    <div class="bigbox">
          <div class="box">
              <h2 align="center">注册</h2>
    
           <div class="input_box" align="center">
               输入账户:<input id="umane"type="text"placeholder="请输入用户名">
           </div>
            <div class="input_box" align="center">
               输入密码:<input id="upass"type="password"placeholder="请输入密码">
           </div>
              <div class="input_box"  align="center">
               再输密码:<input id="userpass1" type="password" placeholder="请再次输入密码">
        </div>
              <div id="error_box"><br></div>
              <div class="input_box" align="center">
                  <button onclick="myLogin()">注册</button>
    
              </div>
                   </div>
    
    </body>
    </html>

posted @ 2017-11-03 21:22  070王学竞  阅读(110)  评论(0编辑  收藏  举报