Question

我的主页上有一个注册表单，它使用服务器端验证和ajax，因此我的页面在验证时不会刷新。

当所有验证通过后，我的页面将被带到registered.html，这是暂时的页面。稍后它将是一个帐户区域。

我想要什么

我希望在实际的表单验证之后有最后一步，这将是我的reCaptcha验证。我不想在验证后提交表单，而是希望reCaptcha弹出twitter风格或者只是替换表单字段的facebook风格。

只有在成功进行验证码验证后才能提交表格。我已经提供了下面的代码，非常感谢有人可以告诉我最好的方法来实现它。现在我正处于困惑的阶段。

错误检查，在最底部，您可以看到在成功验证后将用户发送到registered.html的echo语句

<?php

// we check if everything is filled in

if(empty($_POST['first_name']) || empty($_POST['last_name']) || empty($_POST['email']) || empty($_POST['password']))
{
 die(msg(0,"All the fields are required"));
}


// is the sex selected?

if(!(int)$_POST['sex'])
{
 die(msg(0,"You have to select your sex"));
}


// is the birthday selected?

if(!(int)$_POST['day'] || !(int)$_POST['month'] || !(int)$_POST['year'])
{
 die(msg(0,"You have to fill in your birthday"));
}


// is the email valid?

if(!(preg_match("/^[\.A-z0-9_\-\+]+[@][A-z0-9_\-]+([.][A-z0-9_\-]+)+[A-z]{1,4}$/", $_POST['email'])))
 die(msg(0,"You haven't provided a valid email"));



// Here I must put your code for validating and escaping all the input data,
// inserting new records in your DB and echo-ing a message of the type:

// echo msg(1,"/member-area.php");

// where member-area.php is the address on my site where registered users are
// redirected after registration.




echo msg(1,"registered.html");


function msg($status,$txt)
{
 return '{"status":'.$status.',"txt":"'.$txt.'"}';
}
?>

javascript

$(document).ready(function () {

    $('#fhjoinForm').submit(function (e) {

        register();
        e.preventDefault();

    });

});


function register() {
    hideshow('loading', 1);
    error(0);

    $.ajax({
        type: "POST",
        url: "submit.php",
        data: $('#fhjoinForm').serialize(),
        dataType: "json",
        success: function (msg) {

            if (parseInt(msg.status) == 1) {
                window.location = msg.txt;
            } else if (parseInt(msg.status) == 0) {
                error(1, msg.txt);
            }

            hideshow('loading', 0);
        }
    });

}


function hideshow(el, act) {
    if (act) $('#' + el).css('visibility', 'visible');
    else $('#' + el).css('visibility', 'hidden');
}

function error(act, txt) {
    hideshow('error', act);
    if (txt) $('#error').html(txt);
}

现在我认为必须有一种简单的方法将reCaptcha ajax api实现到我当前的表单中。起初我尝试将onclick="showRecaptcha('recaptcha_div');"添加到我的表单末尾，其中输入类型=提交位于此处不起作用。

表单的结尾

    <td><input type="submit" class="joinButton" value="Join Us" /><img id="loading" src="<?php echo base_url()?>images/join/ajax-loader.gif" alt="working.." /></td>
    <div id="recaptcha_div"></div>
    </tr>

我按照recaptcha网站上的说明操作，到目前为止没有运气。代码片段，建议任何事情都会有所帮助。我很感激。

由于

Answer 1

您是否查看了他们的JS lib API参考？ http://wiki.recaptcha.net/index.php/Overview#AJAX_API

Recaptcha.create("apikey",
  "placeholder_div",
  {
    theme: "red",
    callback: function(){
      // what to do on success, like maybe submit your form
    }
  }
);

您可以在需要的地方创建reCAPTCHA元素，并添加一些回调以执行任何操作。

关于你在何处放置recaptcha创建代码的评论，你可以把它放在你的AJAX请求的回调中

   if(parseInt(msg.status)==1)
   {
     Recaptcha.create("apikey",
       "placeholder_div",
       {
         theme: "red",
         callback: function(){
           // what to do on success
           window.location=msg.txt;
         }
       }
     );
   }

将reCaptcha ajax api实现为已使用ajax的现有Web表单

1 个答案: