用户投稿上一篇用到的注册，其实是有点小问题的，像是如果用户名重複了，或是帐号密码都不打也可以注册
这一篇比较注重jquery，可能比较难?大概说说概念
当用户名重複，最简单的方法就是直接刷新，但是这样用户会觉得莫名其妙，刚刚打的资料都白打了
所以要在html添加jquery预处理判断是否已有该用户名称，如果有button就继续无法使用，如果没有，就会让button可以点击
$.getJSON('../check/',{'username':username}, function(data)
第一个变数是url，第二个是传直到url(get方式)，第三个是那个url回传的值
check必须要使用JsonResponse
register.html
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>register</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $(document).ready(function(){ var name = $("#name"); name.on({ blur:function(){ console.log(name.val().trim()) var username = name.val().trim() if (username.length){ $.getJSON('../check/',{'username':username}, function(data){ console.log(data) if (data['check']){ $("#hint").html('ok').css('color','green'); $('#btn').attr('disabled',false); } else{ $("#hint").html('wrong').css('color','red') } }) } } }) }) </script> </head><body> <form action="{% url 'three:doregister'%}" method="post"><!-- {% csrf_token %}--> <span>username: <input type="text" name="username" id="name"></span> <br> <span id="hint"> </span> <br> <span>password: <input type='password' name="password" required></span> <br> <button disabled='disabled' id="btn">register</button> </form></body></html>views.py
def check(request): username = request.GET.get('username') person = Person.objects.filter(name=username).first() if person: return JsonResponse(data={'check': False}) return JsonResponse(data={'check': True})
微信扫一扫打赏
支付宝扫一扫打赏
