自動驗證帳號-鏈接轉圈css
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>註冊</title> {% load static %} <script src="{% static 'jquery-3.2.1.min.js' %}"></script> <script src="{% static 'jquery.cookie.js' %}"></script> <script> $(function () { userds=document.getElementsByName('userd')[0] userds.onblur=function () { if(userds.value==''){ $('span').text('請輸入用戶名'); userds.focus(); }else { $('span').text(''); $.ajax({ async:true, url:"/goajax/"+ userds.value +"/", type:'post', headers:{'X-CSRFTOKEN':$.cookie('csrftoken')}, beforeSend:function () { $('#img').show(); }, complete:function () { $('#img').hide(); }, success:function (data) { if (data=='true'){ $('span').text('恭喜經過'); $('span').css({"color":"green"}); }else { $('span').text('用戶已佔用'); $('span').css({"color":"red"}); } } }); } } }); </script> </head> <body> <h3>異步驗證註冊</h3> <form method="post" > <input type="text" name="userd" placeholder="請輸入用戶名"><img src="{% static 'loading.gif' %}" width="30" id="img" style="display: none"> <span></span><br> <input type="password" name="passd" placeholder="請輸入密碼"> <input type="submit" value="regs"> </form> </body> </html>
from django.shortcuts import render from django.http import HttpResponse # Create your views here. def goreg(request): return render(request,"regd.html") def goreg2(request): return render(request,"regd2.html") def goajax(request,username): usernames=['zhangsan','lisi'] flag='true' print(username) if username in usernames: flag='false' import time time.sleep(2) return HttpResponse(flag)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>註冊</title> {% load static %} <script src="{% static 'jquery-3.2.1.min.js' %}"></script> <script src="{% static 'jquery.cookie.js' %}"></script> <script> $(function () { userds=document.getElementsByName('userd')[0] userds.onblur=function () { if(userds.value==''){ $('span').text('請輸入用戶名'); userds.focus(); }else { $('span').text(''); $.ajax({ async:true, url:"/goajax/"+ userds.value +"/", type:'post', headers:{'X-CSRFTOKEN':$.cookie('csrftoken')}, beforeSend:function () { $('#img').show(); }, complete:function () { $('#img').hide(); }, success:function (data) { if (data=='true'){ $("#headd").text('恭喜經過'); $("#headd").css({"color":"green"}); }else { $("#headd").text('用戶已佔用'); $("#headd").css({"color":"red"}); } } }); } } $("#picfile").change(function () { var form_data=new FormData(); var file_info=$("#picfile")[0].files[0]; form_data.append("file",file_info); $.ajax({ async:true, url:"/picload/", type:"post", headers:{'X-CSRFTOKEN':$.cookie('csrftoken')}, data:form_data, processData:false, contentType:false, success:function (data) { flagdata=data.split(":") if (flagdata[0]=='true'){ $("#head").text('上傳成功'); $("#head").css({"color":"green"}); document.getElementById('hh').src=flagdata[1] }else { $("#head").text('文件不否合類型'); $("#head").css({"color":"red"}); } } }); }); }); </script> </head> <body> <h3>異步驗證註冊</h3> <form method="post" action="/regss/"> {% csrf_token %} <input type="text" name="userd" placeholder="請輸入用戶名"><img src="{% static 'loading.gif' %}" width="30" id="img" style="display: none"> <span id="headd"></span><br> <input type="password" name="passd" placeholder="請輸入密碼"><br> <input type="file" id="picfile"><span id="head"></span><br> <img src="{% static 'default-user.png' %}" id="hh" width="50"><br/> <input type="submit" value="regs"> </form> </body> </html>
def regdd(request): return render(request,'regdtupian.html') def picload(request): file=request.FILES.get("file") print('文件信息') filename=file.name filetype=filename.split(".")[-1] print("文件名：{0}".format(filename)) print("文件類型：{0}".format(filetype)) print("文件大小：{0}".format(file.size)) alltype=["jpg","gif","png","bmp"] flag="true" if filetype in alltype: uploadpath="app/static/img" if not os.path.exists(uploadpath): os.mkdir(uploadpath) uploadname=str(uuid.uuid1())+"."+filetype path=uploadpath+os.sep+uploadname with open(path,"wb+") as fp: for chunk in file.chunks(): fp.write(chunk) global filepath filepath="/static/img/"+uploadname return HttpResponse("{0}:{1}".format(flag,filepath)) else: flag='false' return HttpResponse("{0}:{1}".format(flag,flag)) def regss(request): username=request.POST.get("userd") userpass = request.POST.get("passd") print(username) print(userpass) print(filepath) return HttpResponse("恭喜註冊成功")
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> {% load static %} <title>Title</title> <script></script> </head> <body> <h2>水果表格</h2> <table border="1"> <tr> <td>水果名稱</td> </tr> {% for i in listd %} <tr> <td>{{ i }}</td> </tr> {% endfor %} </table> {% for k in listd2 %} {{ k.name }} {% endfor %} <br> {% for k,v in listd3.items %} {{ k }}{{ v }} {% endfor %} </body> </html>
def mobandd(request): listd=['蘋果','橘子','香蕉'] listd2=[{'name':'百度'},{'name':'新浪'}] listd3 = [{'name': '百度'}, {'name': '新浪'}] listd3={'name':'百度'} return render(request,'moban1.html',{'listd':listd,'listd2':listd2,'listd3':listd3})