自动验证账号-连接转圈
<!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})