1. ホーム
  2. javascript

ReCaptcha 2.0:recaptchaが成功した場合、コールバックでSubmitボタンを有効にする。

2023-08-03 12:31:51

質問

以下のような非常にシンプルなフォームがあります。これをSubmitボタンが無効になり、Submitボタンだけが有効になるようにしたいのですが の後に の後にのみ有効になります。

これを行うには、いくつかのJavascript / jQueryが必要だと思います。

ReCaptcha 2.0に関するGoogleのドキュメントは、(私にとっては)本当にまばらで密なようです。

<form action="something.php" method="post">
    Name: <input type="text" size="40" name="name"><br><br>
    <div class="g-recaptcha" data-sitekey="############-#####"></div>
    <input type="submit" value="Submit" >
</form>

どのように解決するのですか?

私はテストサイトで同じことをしました。しかし、私は送信の代わりにボタンを使用しました。

を追加する必要があります。 data-callback="enableBtn" data-callbackプロパティは、recaptchaの完了後に指定された関数を実行します。

<div class="g-recaptcha" data-sitekey="############-#####" data-callback="enableBtn"></div>

で、ボタンのidを好きなidにして、disabledに設定します。

<input type="button" value="Submit" id="button1" disabled="disabled">

そして、javascriptでボタンを有効にするための関数を作成します。

 function enableBtn(){
   document.getElementById("button1").disabled = false;
 }

は、それが役立つことを願っています。