使用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>

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

猜你喜欢

转载自www.cnblogs.com/zhangxin123/p/9354016.html