web-dev-qa-db-ja.com

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

私は次のような非常にシンプルなフォームを持っています。 Submitボタンが無効になり、有効になるだけになるようにしたいafterユーザーがReCaptchaを正常に完了した。

これを行うには、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>
57

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

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

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

ボタンのIDを任意のIDに設定します。

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

ボタンを無効にするページ読み込み/フォーム読み込み時

 document.getElementById("button1").disabled = true;

次に、javascriptでボタンを有効にする関数を作成します

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

それが役に立てば幸い。

114
panda.o24