blocks|key|4548298|text|您要查找的方法是grecaptcha.reset()|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4548299|但是，为了让这个函数工作，您必须像下面这样显式地呈现reCaptacha：<script+src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"+async+defer></script>|4548300|entityMap^0|8|I|0|11|35|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|P|8|@]|D|@]|E|$]]]|I|$]]

The method you are looking for is <code>grecaptcha.reset()</code>

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

blocks|key|41466|text|我个人将元素html内容重置为|type|unstyled|depth|inlineStyleRanges|entityRanges|data|41467|$('#captcha').html('');|code-block|syntax|javascript|41468|在此之后，我使用以下命令重新加载了recaptcha|41469|$.getScript("https://www.google.com/recaptcha/api.js");|41470|将recaptcha内容加载到|41471|<div+id="captcha"+class="g-recaptcha"+data-sitekey="yourSitePublicKey"></div>|41472|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

Personnaly I reset my element html content with

<pre><code>$('#captcha').html('');
</code></pre>

after that I reload recaptcha using

<pre><code>$.getScript("https://www.google.com/recaptcha/api.js");
</code></pre>

which load recaptcha content on your

<pre><code>&lt;div id="captcha" class="g-recaptcha" data-sitekey="yourSitePublicKey"&gt;&lt;/div&gt;
</code></pre>

blocks|key|41511|text|我能够做到这一点，只需使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|41512|grecaptcha.reset();|code-block|syntax|javascript|41513|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I was able to do it just by using:

<pre><code>grecaptcha.reset();
</code></pre>

blocks|key|41534|text|以下是@tzafar答案附带的一些代码：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|41535|var+myCaptcha+=+null;
function+prepCaptcha()+{
++++if+(myCaptcha+===+null)
++++++++myCaptcha+=+grecaptcha.render(document.getElementById('my-captcha'),+{
++++++++++++'sitekey':+myCaptchaKey,
++++++++++++'theme':+'light'
++++++++});
++++else
++++++++grecaptcha.reset(myCaptcha);
}|code-block|syntax|javascript|41536|在我的例子中，my-captcha是Bootstrap模式中的div的id。我在模态的shown.bs.modal事件的事件处理程序中运行prepCaptcha()。第一次，它初始化验证码。在随后的模式显示中，它会对其进行重置。|offset|length|style|CODE|41537|此外，请注意，您可以通过打印完成的验证码的值来快速验证您是否获得了新的验证码：|41538|console.log(grecaptcha.getResponse(myCaptcha));|41539|您不应该看到相同的值两次。|41540|entityMap^0|0|0|7|A|V|3|17|E|1X|D|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@$I|X|J|Y|K|L]|$I|Z|J|10|K|L]|$I|11|J|12|K|L]|$I|13|J|14|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|15|8|@]|9|@]|A|$]]|$1|O|3|P|5|D|7|16|8|@]|9|@]|A|$E|F]]|$1|Q|3|R|5|6|7|17|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|18|8|@]|9|@]|A|$]]]|T|$]]

Here's some code to accompany @tzafar's answer:

<pre><code>var myCaptcha = null;
function prepCaptcha() {
 if (myCaptcha === null)
 myCaptcha = grecaptcha.render(document.getElementById('my-captcha'), {
 'sitekey': myCaptchaKey,
 'theme': 'light'
 });
 else
 grecaptcha.reset(myCaptcha);
}
</code></pre>

In my case, <code>my-captcha</code> is the id of a <code>div</code> inside of a Bootstrap modal. I run <code>prepCaptcha()</code> in the event handler for the modal's <code>shown.bs.modal</code> event. The first time, it initializes the captcha. On subsequent shows of the modal, it resets it.

Also, note that you can quickly verify that you're getting a new captcha by printing the completed captcha's value:

<pre><code>console.log(grecaptcha.getResponse(myCaptcha));
</code></pre>

You shouldn't see the same value twice.

blocks|key|41288|text|您的recaptcha+render+js事件只能在脚本中调用一次，如果在脚本中第二次调用grecaptcha.render+js事件，则您的recaptcha代码无效。您应该检查您的代码，这样它就不会在验证检查时再次调用grecaptcha.render函数。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|41289|或|41290|在控制台中，您将看到一条Uncaught+ReferenceError:+Recaptcha+is+not+defined错误消息，指示reCAPTCHA脚本存在问题。这是由于页面-+http://api.recaptcha.net/js/recaptcha_ajax.js中的一个错误url造成的。谷歌已经更新了reCAPTCHA，并将脚本的位置移到了http://www.google.com/recaptcha/api/js/recaptcha_ajax.js。|41291|也可以查看这篇文章|41292|http://www.instructables.com/id/Fix-reCAPTCHA-errors-on-Instructables/|41293|还有这篇文章|41294|Uncaught+ReferenceError:+Recaptcha+is+not+defined|41295|entityMap|0|LINK|mutability|MUTABLE|url|1|https://stackoverflow.com/questions/22540612/uncaught-referenceerror-recaptcha-is-not-defined^0|19|H|33|H|0|0|C|1D|2K|19|4X|1K|0|0|0|1Y|0|0|0|0|1D|1|0^^$0|@$1|2|3|4|5|6|7|10|8|@$9|11|A|12|B|C]|$9|13|A|14|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|15|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|16|8|@$9|17|A|18|B|C]|$9|19|A|1A|B|C]|$9|1B|A|1C|B|C]]|D|@]|E|$]]|$1|J|3|K|5|6|7|1D|8|@]|D|@]|E|$]]|$1|L|3|M|5|6|7|1E|8|@]|D|@$9|1F|A|1G|1|1H]]|E|$]]|$1|N|3|O|5|6|7|1I|8|@]|D|@]|E|$]]|$1|P|3|Q|5|6|7|1J|8|@]|D|@$9|1K|A|1L|1|1M]]|E|$]]|$1|R|3|-4|5|6|7|1N|8|@]|D|@]|E|$]]]|S|$T|$5|U|V|W|E|$X|M]]|Y|$5|U|V|W|E|$X|Z]]]]

your recaptcha render js event should be called only once in the script, your recaptcha code is not valid if <code>grecaptcha.render</code> js event called second time in script. You should have to check your code so it should not call the <code>grecaptcha.render</code> function second time on validation check.

OR 

In console, You will see a <code>Uncaught ReferenceError: Recaptcha is not defined</code> error message, which indicates the problem with the reCAPTCHA script. This is caused due to a bad url in the page - <code>http://api.recaptcha.net/js/recaptcha_ajax.js</code> . Google has updated the reCAPTCHA and moved the location of the script to <code>http://www.google.com/recaptcha/api/js/recaptcha_ajax.js</code> .

also check this post

<a href="http://www.instructables.com/id/Fix-reCAPTCHA-errors-on-Instructables/" rel="nofollow noreferrer">http://www.instructables.com/id/Fix-reCAPTCHA-errors-on-Instructables/</a>

and this post

<a href="https://stackoverflow.com/questions/22540612/uncaught-referenceerror-recaptcha-is-not-defined">Uncaught ReferenceError: Recaptcha is not defined</a>

blocks|key|4548464|text|如果你正在使用WordPress，确保你没有另一个reCaptcha插件installed...that是我的问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4548465|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

If you're using WordPress, make sure you don't have another reCaptcha plugin installed...that was the issue for me.

blocks|key|41328|text|尝试在ReCaptcha+(版本1)中调用reload()函数：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|41329|Recaptcha.reload();|code-block|syntax|javascript|41330|How+to+Reload+ReCaptcha+using+JavaScript?|41331|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/3371314/how-to-reload-recaptcha-using-javascript^0|L|8|0|0|0|15|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

Try calling the <code>reload()</code> function within ReCaptcha (version 1):

<pre><code>Recaptcha.reload();
</code></pre>

<a href="https://stackoverflow.com/questions/3371314/how-to-reload-recaptcha-using-javascript">How to Reload ReCaptcha using JavaScript?</a>

blocks|key|41427|text|如果您使用的是新的recaptcha+2.0，请使用以下代码：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|41428|ScriptManager.RegisterStartupScript(this,+this.GetType(),+"CaptchaReload",+"$.getScript(\"https://www.google.com/recaptcha/api.js\",+function+()+{});",+true);|code-block|syntax|javascript|41429|对于简单的javascript|41430|<script>$.getScript(\"https://www.google.com/recaptcha/api.js\",+function+()+{});</script>|41431|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

if you are using new recaptcha 2.0 use this:
for code behind:

<pre><code>ScriptManager.RegisterStartupScript(this, this.GetType(), "CaptchaReload", "$.getScript(\"https://www.google.com/recaptcha/api.js\", function () {});", true);
</code></pre>

for simple javascript

<pre><code>&lt;script&gt;$.getScript(\"https://www.google.com/recaptcha/api.js\", function () {});&lt;/script&gt;
</code></pre>

blocks|key|41548|text|<script>
function+cform(token)+{
$.ajax({
type:+'POST',
url:+'contact_chk.php',
data:+$('#cform').serialize(),+
success:+function(response)+{
grecaptcha.reset();
$("#con_msg").html(response);
document.getElementById("name").value='';
document.getElementById("subject").value='';
document.getElementById("email").value='';
document.getElementById("phone").value='';
document.getElementById("message").value='';
},
error:+function(response)+{
grecaptcha.reset();
$("#con_msg").html('Try+Again...');
}
});
}
</script>
<script+src='https://www.google.com/recaptcha/api.js'></script>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|41549|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>&lt;script&gt;
function cform(token) {
$.ajax({
type: 'POST',
url: 'contact_chk.php',
data: $('#cform').serialize(), 
success: function(response) {
grecaptcha.reset();
$("#con_msg").html(response);
document.getElementById("name").value='';
document.getElementById("subject").value='';
document.getElementById("email").value='';
document.getElementById("phone").value='';
document.getElementById("message").value='';
},
error: function(response) {
grecaptcha.reset();
$("#con_msg").html('Try Again...');
}
});
}
&lt;/script&gt;
&lt;script src='https://www.google.com/recaptcha/api.js'&gt;&lt;/script&gt;
</code></pre>

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. 

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

EDIT:

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

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

How to reload the google recaptcha widget after user submits invalid inputs

验证码

WordPress

我有一个注册表，上面有新的google recaptcha小部件。当用户提交信息时，我们使用javascript检查验证，并将问题返回到页面(例如：“请使用有效的电话号码”)。然而，由于页面不会重新加载，当用户输入正确的信息并再次提交时(无需再次执行recaptcha )，...the recaptcha将不再有效，并且在不重新加载页面的情况下无法提交。有没有一个很好的解决方案？我可以以某种方式重

问如何在用户提交无效输入后重新加载google recaptcha小部件
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在用户提交无效输入后重新加载google recaptcha小部件EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在用户提交无效输入后重新加载google recaptcha小部件
EN