实现账号是否存在,密码是否正确,以及验证码是否正确的一个验证
主要流程:首先判空,如果不为空,发送ajax请求,将input的值传递到服务器,服务器接受请求,判断数据是否在数据库,如果是返回1,如果不是返回0,浏览器接受服务器响应如果是1,则对应的verify_key设置为true作为表单提交的条件,如果是0,则在input元素后面加上span元素内容为提示句。
做验证码动态更换时进行ajax请求时,验证码的路径必须是随机生成,不能一直不变,否则失败。

代码如下,浏览器js文件:

    window.onload = function(){
    $('#but1').click(function(){
    window.location.href = '/paopaoapp/regist/';
   });
   $("#but3").click(function(){
   $.ajax({
   url:'/paopaoapp/insteadverify/',
   type:'post',
   data:{'num':1},
   success:function(data){
   console.log(data);
   $('#img_id').attr('src','/'+data);
   }
   });
   });
   var username_key = false;
   var password_key = false;
   var verify_key = false;

   $('#name_id').blur(function(){
   if($(this).val()==""){$(this).next().text("账号不能为空");}
   else{
   $.ajax({
        url: '/paopaoapp/verifyname/',
        type: 'post',
        data: {
            username:$(this).val(),
        },
        success: function (data) {
            if(data=='1'){
            $("#span_name").text("");
            username_key = true;}
            else{
            $("#span_name").text("账号不存在");
            }
        },
    })}
   });

   $('#pwd_id').blur(function(){
   if($(this).val()==""){$(this).next().text("密码不能为空");}
   else{
   $.ajax({
        url: '/paopaoapp/verifypassword/',
        type: 'post',
        data: {
            username:$("#name_id").val(),
            password:$(this).val()
        },
        success: function (data) {
            console.log(data)
            if(data=='1'){
            $("#span_password").text("");
            password_key = true;}
            else{
            $("#span_password").text("账号或密码不正确");
            }
        },
    })
   }
   });

   $('#verify_id').blur(function(){
  if($(this).val()==""){$("#verify_id").text("验证码不能为空");}
  else{
  $.ajax({
        url: '/paopaoapp/verifyverify/',
        type: 'post',
        data: {
            verify:$("#verify_id").val(),
        },
        success: function (data) {
            console.log(data)
            if(data=='1'){
            $("#span_verify").text("");
            verify_key = true;}
            else{
            $("#span_verify").text("验证不正确");
            }
        },
    })
  }
   });

   $('#but2').click(function(){
   alert(username_key);
   if(username_key&password_key&verify_key){
   return true;
   }else{return false;}
   });
   }

服务器:

def verifyname(request):
    username = request.POST['username']
    user = UserInfo.objects.values('username')
    user = [data['username'] for data in user]
    if username not in user:
        return HttpResponse(0)
    else:
        return HttpResponse(1)

def verifypassword(request):
    username = request.POST['username']
    user_list = UserInfo.objects.values('username','password')
    user = [data['username'] for data in user_list]
    pwd = [data['password'] for data in user_list]
    password = request.POST['password']
    if username not in user or password not in pwd:
        return HttpResponse(0)
    else:
        return HttpResponse(1)

def verifyverify(request):
    verify = request.POST['verify']
    if (verify==request.session['verify']):
        return HttpResponse(1)
    else:
        return HttpResponse(0)
Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐