如何在用户提交无效输入后重新加载google recaptcha小部件
我有一个注册表单，上面有新的google recaptcha小部件。 当用户提交信息时，我们使用javascript检查validation并将问题返回到页面（例如：“请使用有效的电话号码”）。 但是，由于页面没有重新加载，当用户输入正确的信息并再次提交时（无需再次重新执行）… recaptcha不再有效，他们无法在不重新加载页面的情况下提交。
有一个很好的解决方案吗？ 我可以以某种方式重新加载小部件吗？ 我试过grecaptcha.render，但它没有真正做任何事情。
编辑：
当我尝试再次渲染窗口小部件时，它说“占位符元素必须为空”
我尝试清空似乎有效的元素（$（’。g-recaptcha’）。empty（）;）然后渲染但它仍然抛出相同的错误。
您正在寻找的方法是grecaptcha.reset()
但是，为了使此function起作用，您必须显式地呈现reCaptacha，如下所示：
如果你在jQuery中使用grecaptcha.render，请确保你实际设置DOM元素，而不是jQuery元素：
这将有效：
grecaptcha.render( $('.g-recaptcha')[0], { sitekey : 'your_key_here' });
但这不会 ：
grecaptcha.render( $('.g-recaptcha'), { sitekey : 'your_key_here' });
我只能通过使用：
grecaptcha.reset();
以下是@ tzafar答案的一些代码：
var myCaptcha = null; function prepCaptcha() { if (myCaptcha === null) myCaptcha = grecaptcha.render(document.getElementById('my-captcha'), { 'sitekey': myCaptchaKey, 'theme': 'light' }); else grecaptcha.reset(myCaptcha); }
在我的例子中， my-captcha是Bootstrap模式中div的id。 我在modal的shown.bs.modal事件的事件处理程序中运行prepCaptcha() 。 第一次，它初始化validation码。 在随后的模态显示中，它会重置它。
另请注意，您可以通过打印已完成的validation码值来快速validation您是否获得了新的validation码：
console.log(grecaptcha.getResponse(myCaptcha));
您不应该两次看到相同的值。
Personnaly我重置我的元素html内容
$('#captcha').html('');
之后我重新加载recaptcha
$.getScript("https://www.google.com/recaptcha/api.js");
加载重新收录的内容
你的recaptcha渲染js事件应该只在脚本中调用一次，如果在脚本中第二次调用grecaptcha.render js事件，你的重grecaptcha.render代码无效。 您应该检查您的代码，以便它不应该在validation检查时第二次调用grecaptcha.render函数。
要么
在控制台中，您将看到Uncaught ReferenceError: Recaptcha is not defined错误消息，指示reCAPTCHA脚本的问题。 这是由于页面中的url错误造成的 – http://api.recaptcha.net/js/recaptcha_ajax.js 。 Google已更新reCAPTCHA并将脚本的位置移至http://www.google.com/recaptcha/api/js/recaptcha_ajax.js 。
还查看这篇文章
http://www.instructables.com/id/Fix-reCAPTCHA-errors-on-Instructables/
这篇文章
未捕获的ReferenceError：未定义Recaptcha
如果你使用新的recaptcha 2.0使用这个：代码背后：
ScriptManager.RegisterStartupScript(this, this.GetType(), "CaptchaReload", "$.getScript(\"https://www.google.com/recaptcha/api.js\", function () {});", true);
对于简单的JavaScript
我对excelwebzone/recaptcha-bundle也有同样的问题。 基本上是说recaptcha过去加载到你的DOM和占位符应该是空的已满 。
这些bundle没有显式回调的设置，因此在加载recaptcha之前，你必须确保占位符甚至整个表单都是空的 。
而且我被困在DOM中因为我用AJAX加载它。 在第二次通话时它就在那里。
你可以简单地使用$('#your-div-with-form').html('')
尝试在ReCaptcha（版本1）中调用reload()函数：
Recaptcha.reload();
如何使用JavaScript重新加载ReCaptcha？
如果你正在使用WordPress，请确保你没有安装另一个reCaptcha插件……这对我来说是个问题。