如何在用户提交无效输入后重新加载google recaptcha小部件 [英] How to reload the google recaptcha widget after user submits invalid inputs

问题描述

我有一个新的google recaptcha小部件的注册表单。当用户提交信息时，我们使用javascript检查验证并将问题返回到页面（例如：请使用有效的电话号码）。但是，由于页面没有重新加载，当用户输入正确的信息并再次提交时（无需再次进行重新记录）... recaptcha不再有效，他们无法在不重新加载页面的情况下提交。

I have a registration form with the new google recaptcha widget on it. When a user submits info, we check the validation with javascript and return the problems to the page (ex: "please use a valid phone number"). however, since the page doesn't reload, when the user enters correct info and goes to submit again (without having to do the recaptcha again)...the recaptcha is no longer valid and they can't submit without reloading the page.

这是一个很好的解决方案吗？我可以以某种方式重新加载小部件吗？我试过grecaptcha.render但它没有真正做任何事情。

is there a good solution to this? can I reload the widget somehow? i tried grecaptcha.render but it didn't really do anything.

编辑：

当我尝试再次渲染小部件，它说占位符元素必须为空

When I try to render the widget again, it says "placeholder element must be empty"

我尝试清空似乎有效的元素（$（'。g-recaptcha'）。 （）;）然后渲染，但它仍然抛出相同的错误。

I tried emptying the element which seemed to work ($('.g-recaptcha').empty();) and then rendering but it still threw the same error.

推荐答案

您正在寻找的方法是 grecaptcha.reset（）

但是，要使此功能正常工作，您必须显式地呈现reCaptacha：< script src =https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicitasync defer>< / script>

However, in order for this function to work you have to render the reCaptacha explicitly like this : <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script>

这篇关于如何在用户提交无效输入后重新加载google recaptcha小部件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！