模式窗口(FancyBox)中的Recaptcha

我对FancyBox也有同样的问题。我使用recaptchajax API解决了这个问题: https://developers.google.com/recaptcha/docs/display#AJAX

我也有同样的问题,虽然只是在狩猎(大概也是铬合金)。它在火狐中运行良好。它与Ruby无关(我使用Grails),所有jQuery弹出窗口都会出现问题(我尝试过blockui、simpelmodal和thickbox)。

据我所知,出于某种原因,当jquery在domrete中移动iframe(这就是recaptcha)时,webkit决定将iframe内容作为新页面加载。或者用iframe内容替换页面内容。

我很确定这是一个WebKit错误,我不知道是否有可能修复。

编辑: 结果发现有一种解决方法:

$('#captcha-form script').remove();

“captcha form”是包含captcha的表单的ID。删除脚本标记,以便在jquery移动脚本后Safari重新呈现它们时,脚本不会再次执行。脚本创建的事件处理程序不在脚本标记中,因此它们仍然存在。

我认为Safari在重新呈现标记时会重新执行javascript。模式对话框中的任何内容都会在对话框打开时重新呈现。此外,我怀疑在重新呈现之后,recaptcha使用的document.write会对它的位置感到困惑,并将其弄乱。

如果有人仍然在寻找一个简单的解决方案,我已经设法让一个recaptcha在FancyBox中工作,把它作为一个iframe调用。

如果从类选择器调用它:

<script>
$(document).ready(function() {
     $(".example").fancybox({
          fitToView   : true,
          autoSize    : false,
          openEffect  : 'elastic',
          closeEffect : 'elastic'
     });
});
</script>

然后在HTML中

<a href="http://url.com/iframe" class="example fancybox.iframe>Captcha Fancybox</a>

或者,如果您正在通过编程触发FancyBox,请执行以下操作:

$.fancybox({
     width        : '520px',
     height       : '230px',
     autoSize     : false,
     openEffect   : 'elastic',
     closeEffect  : 'elastic',
     'href'       : 'http://www.url.cc',
     type         : 'iframe'
  });

在FancyBox中通过Ajax加载reCaptcha表单的简单解决方案。

<%= recaptcha_tags ajax: true %>