我在一个页面上有2个表格。其中一个表单具有始终显示的验证码。另一个应该在特定事件（例如最大化登录尝试）之后显示验证码。所以有时候我需要2个验证码才能出现在同一页面上。这可能吗？我知道我可能会为两者使用一个，但是我有布局的方式，我更喜欢有2个。谢谢。
更新：好吧，我想这可能是不可能的。任何人都可以推荐另一个捕获库与reCaptcha并排使用吗？我真的希望能够在同一页面上有2个验证码。
更新 2：如果将每个表单放在一个 iframe 中会怎样？这是一个可以接受的解决方案吗？
使用当前版本的 Recaptcha（reCAPTCHA API 版本 2.0），您可以在一个页面上拥有多个验证码。
无需克隆验证码，也无需尝试解决此问题。您只需要为验证码放置多个 div 元素，并在其中显式呈现验证码。
这很容易与谷歌验证卡 api：
https://developers.google.com/recaptcha/docs/display#explicit_render
下面是示例 html 代码：
<form>
<h1>Form 1</h1>
<div><input type="text" name="field1" placeholder="field1"></div>
<div><input type="text" name="field2" placeholder="field2"></div>
<div id="RecaptchaField1"></div>
<div><input type="submit"></div>
</form>
<form>
<h1>Form 2</h1>
<div><input type="text" name="field3" placeholder="field3"></div>
<div><input type="text" name="field4" placeholder="field4"></div>
<div id="RecaptchaField2"></div>
<div><input type="submit"></div>
</form>
在你的javascript代码中，你必须为recaptcha定义一个回调函数：
<script type="text/javascript">
var CaptchaCallback = function() {
grecaptcha.render('RecaptchaField1', {'sitekey' : '6Lc_your_site_key'});
grecaptcha.render('RecaptchaField2', {'sitekey' : '6Lc_your_site_key'});
};
</script>
在此之后，您的 recaptcha 脚本 url 应如下所示：
<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>
或者，您可以提供类名并使用类选择器循环这些元素并调用 .render（） 而不是为 recaptcha 字段提供 ID
简单明了：
1）通常使用以下方式创建您的验证码字段：
<div class="g-recaptcha" data-sitekey="YOUR_KEY_HERE"></div>
2） 加载脚本：
<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>
3）现在调用它来迭代字段并创建验证码：
<script type="text/javascript">
var CaptchaCallback = function() {
jQuery('.g-recaptcha').each(function(index, el) {
grecaptcha.render(el, {
'sitekey' : jQuery(el).attr('data-sitekey')
,'theme' : jQuery(el).attr('data-theme')
,'size' : jQuery(el).attr('data-size')
,'tabindex' : jQuery(el).attr('data-tabindex')
,'callback' : jQuery(el).attr('data-callback')
,'expired-callback' : jQuery(el).attr('data-expired-callback')
,'error-callback' : jQuery(el).attr('data-error-callback')
});
});
};
</script>
