使用flask+SQL语句实现通过前台收到的信息向数据库中插入事件+初级CSS+HTML拯救一下我的主页·····

1.使用flask+SQL语句实现**#@&&(懒得再扣一遍题目) 
上代码:

@app.route('/register', methods=['POST', 'GET'])
def register():
    if(request.method=='POST'):
        statement = text("""select accounts from zhuce where accounts=:accounts """).bindparams(accounts=request.form['accounts'])
        rows = db_engine.execute(statement).fetchall()
        if(len(rows) !=0):
            return jsonify({
            'status':401,
            'message':'该用户名已经存在'
        })


        statement=text("""insert into zhuce(accounts,passwordBegin,passwordLast) values(:accounts,:passwordBegin,:passwordLast) """).bindparams(accounts=request.form['accounts'],passwordBegin=request.form['passwordBegin'],passwordLast=request.form['passwordLast'])
        db_engine.execute(statement)
        return jsonify({
            'status':200,
            'message':'用户注册成功'
        })
    return render_template('register.html')

这是app.py部分的代码 

这段代码成功运行之前我的bug让我遇见了各种错误码,有的是因为SQL语句书写不规范 select的元素却没在where中写全 后来加了一个and终于完成,还有写insert语句时,因为有的属性默认的不可以非空,三个元素少一个都提醒MYSQL错误,不过还好后来完成了嘻嘻嘻 
这段路由越来越健壮了,现在加了SQL语句还有一个if判断语句,通过上一行的rows来获取后台数据库和前台收到的数据属性的比对,下面的if语句进行判断,如果这个用户的注册id已经之前有人注册过了,已经在数据库中存在了,它就会提醒你这个账号已经被注册过 报错。 
POST是一个向后台传数据的请求 ,当时我的ajax+jQuery部分少了这个请求,一直可以运行就是没插入进去:

 $.ajax({
                    url:'/register',
                    type:'POST',
                    data:{
                        accounts:a.value,
                        passwordBegin:p.value,
                        passwordLast:m.value

                    },
                    dataType:'json'
                }).success(function (res) {
                    console.log(res)
                    if(res.status==401){
                        alert(res.error)
                    }
                    else if(res.status==200){
                        window.location.href='/login'
                    }

                })

2.之前一直不敢尝试css+html的制作页面方式,但是HTML标签属性实在是太有限了,做出来的丑的我脑瓜银子疼~~~~ 
利用css,在head部分定义一个标签,里面写上自己希望这个标签带来的改变,在body中,直接在想加上这种特效部分的开头和末尾加上这个标签就OK了:

<style type="text/css">
        #myDIV {
    font-family:Verdana;      
    width: 200px;
    height: 100px;
    -webkit-animation: mymove 5s infinite; /* Chrome, Safari, Opera */
    animation: mymove 5s infinite;

}

/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
    50% {font-size: 40px;}
}

/* Standard syntax */
@keyframes mymove {
    50% {font-size: 40px;}
}

            ul li {
                list-style-type: none;
                /* 去掉li前的点 */
                float: left;
                /*将li设置成做浮动,变为联动*/
            }

            ul li a {
                display: block;
                /*将a变成块状*/
                width: 100px;
                /*设置块的宽度*/
                height: 50px;
                /*设置块的长度*/
                font-family: Microsoft Yahei;
                line-height: 50px;
                /*设置字体在块中的高度*/
                background-color: #000;
                margin: 0px 0px;
                /*块里的高宽通过margin设置*/
                color: #fff;
                text-align: center;
                /*字体居中*/
                text-decoration: none;
                /*去掉下划线*/
                font-size: 15px;
            }

            ul li a:hover {
                background-color: #DAA520;
            }
            uul li{
                list-style-type: none;
                float: right;
            }
            uul li a{
                color:#000;
                background-color: #ffff;
                font-size: 10px;
                display: block;
                /*将a变成块状*/
                width: 100px;
                /*设置块的宽度*/
                height: 50px;
                /*设置块的长度*/
                font-family: Microsoft Yahei;
                line-height: 50px;

            }
            uul li a:hover{
                background-color: #DAA520;
            }
        </style>

 

这部分实现了导航的样式,还有一部分文字的渐变效果。这里写图片描述
这里写图片描述
花哥还是给我吐槽坏了哈哈哈哈,我需要再想想再往下开发,哭~~~~

posted @ 2018-07-23 12:16  张馨  阅读(234)  评论(0编辑  收藏  举报