如何仅在加载jQuery对话框时加载recaptcha代码

Question

我在jQuery对话框中有一个recaptcha代码.

出于某种原因,当我在firefox中加载页面时,它会挂起(虽然在IE/Chrome上运行得很好).我发现对话框中的recaptcha导致了它.

我想如果我只在用户打开可能解决问题的对话框时加载重新访问代码,并且还帮助我减少一般的出站连接数量.

这是与recaptcha相关的位的"查看源":

<div id="dialog-form" title="Create new user"> 
    <p class="validateTips">You can also Connect with Facebook</p> 
    <fb:login-button perms="publish_stream,create_event,rsvp_event,user_birthday,user_events,user_hometown,user_location,user_online_presence">Login to Facebook</fb:login-button> 
    <form id="regform" action="" method="post"> 
    <fieldset> 
        <label for="name">Username</label> 
        <input type="text" name="username" id="name" class="text ui-widget-content ui-corner-all" value="" /> 
        <label for="email">Email</label> 
        <input type="text" name="email" id="email" class="text ui-widget-content ui-corner-all" value="" /> 
        <label for="password" style="float:left;">Password&nbsp;&nbsp;&nbsp;&nbsp;</label> 
        <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" /> 
        <input type="hidden" name="reg" value="reg" /> 
    </fieldset> 
    <script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LerjL4SAAAAAG3sq_40sHyvch501El5JoNkHqOR"></script> 

    <noscript> 
        <iframe src="http://www.google.com/recaptcha/api/noscript?k=6LerjL4SAAAAAG3sq_40sHyvch501El5JoNkHqOR" height="300" width="500" frameborder="0"></iframe><br/>
        <textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
        <input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
    </noscript>     </form> 
</div> 

它位于页面底部,就在标签之前,因此它不是嵌套的或任何东西.

我该怎么做？

谢谢,

Answer 1

如果您计划在弹出对话框中使用reCaptcha,我强烈建议您使用javascript api.我发现在这种情况下FireFox可能无法处理iframe.

在接到客户端javascript中打开对话框的调用后,您需要创建如下所示的验证码:

Recaptcha.create(YOUR_API_KEY,
    "captcha_contain",
    {
    theme: "red",
    callback: Recaptcha.focus_response_field
    }
);

其中"captcha_contain"是对话框中元素的id,大概是一个开放的div.它也会稍微改变您的服务器端代码,但您可以在API中阅读所有相关信息.