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;
}
は、それが役立つことを願っています。
関連
-
[解決済み] jQueryの送信ボタンの無効化・有効化
-
[解決済み] Can I make a <button> not submit a form?
-
[解決済み] 上級者向けJavaScript。この関数はなぜ括弧でくくられるのですか?重複
-
[解決済み] なぜJavaScriptでは!{}[true]がtrueに評価されるのですか?
-
[解決済み] ExtJS 4のイベントハンドリングについて
-
[解決済み] 文字列のn番目の出現箇所を取得するには?
-
[解決済み] モバイルWeb HTML5フレームワークの選び方【終了しました
-
[解決済み] JSXとLoadshを使用して、ある要素をn回繰り返す方法
-
[解決済み] Chromeのwebkitインスペクタで「Unsafe JavaScript attempt to access frame with URL...」というエラーが継続的に発生する。
-
[解決済み] javascriptのキャンバスで画像をリサイズする (スムーズ)
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] チェックボックスが選択されているかどうかを確認するjQuery
-
[解決済み] reactのrender関数でdynamic hrefを作成するには?
-
[解決済み] 文字列のn番目の出現箇所を取得するには?
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] bootstrap のポップオーバーがすべての要素の上に表示されない
-
[解決済み] アサインの左側にJavascriptのオブジェクトブラケット表記({ ナビゲーション } =)があります。
-
[解決済み] TypeScriptプロジェクトで既存のC#クラス定義を再利用する方法
-
[解決済み] jQueryで入力ファイルが空かどうかをチェックする方法
-
[解決済み] 文字列とラベルのローカライズとグローバリゼーションのベストプラクティス【終了しました
-
[解決済み] javascriptのキャンバスで画像をリサイズする (スムーズ)