Question

我警告你现在很少有关于jquery的经历。我的问题是这个。我有一个用户名和密码表单。我有Jquery，访问一个php页面看着数据库匹配密码和用户名然后回声“是”或没有基于关闭，如果输入是正确的，然后带我到下一页。既然这个Jquery在提交时工作，我就无法弄清楚如何正确地将javascript验证码添加到页面中，因为它不会验证这个单词。所以我想知道如何更改或添加到此代码，以便我可以首先使用javascript验证该单词，然后使用下面的jquery。任何帮助将不胜感激。

<script language="javascript">
    $(document).ready(function()
    {
        $("#login_form").submit(function()
        {
            //remove all the class add the messagebox classes and start fading
            $("#msgbox").removeClass().addClass('messagebox').text('Validating....').fadeIn(1000);
            //check the username exists or not from ajax
        $.post("ajax_login.php",{ user_name:$('#username').val(),password:$('#password').val(),rand:Math.random() } ,function(data)
            {
              if(data=='yes') //if correct login detail
              {
                $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
                { 
                  //add message and change the class of the box and start fading
                  $(this).html('Logging in.....').addClass('messageboxok').fadeTo(900,1,
                  function()
                  { 
                     //redirect to secure page
                     document.location='edujob.php';
                  });
                });
              }
              else 
              {
                $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
                { 
                  //add message and change the class of the box and start fading
                  $(this).html('incorrect').addClass('messageboxerror').fadeTo(900,1);
                });     
              }

            });
            return false; //not to post the  form physically
        });
        //now call the ajax also focus move from 

    });
    </script>

Answer 1

我怀疑你是否可以拥有一个仅限客户端的验证码，服务器端必须以某种方式参与匹配混乱的单词与用户输入的内容。如果在客户端发生匹配，则意味着机器人可以访问原始单词并传递给人类。

你使用什么验证码？任何插件或自制的东西？

Answer 2

客户端验证码是无用的，因为它可以被最终用户绕过。我建议你使用验证码库。例如，reCAPTCHA是由Google维护的非常简单且强大的服务器端库，易于实现（reCAPTCHA PHP Docs）。

一旦实现，我将用以下内容更改javascript ajax调用：

$.ajax({
  url: "ajax_login.php",
  type: "text",
  dataType: "string",
  data: $("#login_form").serialize(),
  success: function(data) {
    if(data === "yes") {
      // DO SOMETHING
    } else {
      // DO SOMETHING

      // Reload reCAPTCHA
      if(typeof Recaptcha === "object") {
        Recaptcha.reload();
      }

    }
  }
});

这就是我认为最好的解决方案。

同一页面上的Jquery和Captcha无法正常工作

2 个答案: