功能实现背景:
前端jquery.js
基于django框架,前后端分离。
HTML代码:
<input type="email" id="user_email" class="email_input" placeholder="用户名(邮箱)">
JS代码:
$("#user_email").blur(function(){
var user_email=$('#user_email').val();
console.log(user_email);
if(user_email){
var url=ip_number+"usernamecountview/";
$.ajax({
url:url,
type:"post",
data:{
"username":user_email,
},
success:function (e) {
var ed=JSON.parse(e);
if(ed.message=="0"){
}else {
alert(ed.message);
location.reload()
}
}
})
}
}),
后端代码:
def usernamecountview(request):
username = request.POST.get('username')
count = UserInfo.objects.filter(username=username).count()
if count == 0:
return HttpResponse(json.dumps({'message': '0'}))
else:
return HttpResponse(json.dumps({'message': '用户名已存在'}))
一些基本的路径搭建,样式,就不在此一一贴出了。
由于是行里使用,在此也不必多说了。此功能并未加入到项目中,经理给的理由是宁愿用户体验差也不要出现漏洞(撞库)。