11

jQueryと「ajax」リクエストを使用して、フォーム内に最新のReCaptcha(別名「見えない」ReCaptcha)を実装しようとしています。
ReCaptcha ドキュメント: https://developers.google.com/recaptcha/docs/invisible

私のフォーム:

<form id="myForm" >
    <input type="email" name="email" /><br />
    <input type="password" name="password" /><br/>
    <!--<input type="submit" value="log in" />-->
    <button class="g-recaptcha" data-sitekey="6LdK..." data-callback="onSubmit">log in</button>
</form>
<div id="status"></div>

私のJavaScript(jQuery):

<script>

    function onSubmit(token){
        document.getElementById("myForm").submit();
    }

    $(document).ready(function(){

        $("#myForm").submit(function(event){
            event.preventDefault();
            var datas = $("#myForm").serialize();
            $.ajax({
                type: "POST",
                url: "test.php",
                data: datas,
                dataType: "json",
                    beforeSend: function(){
                        $("#status").html("logging in...");
                    },
                    success: function(response){
                        $("#status").html(response.text);
                        if(response.type=="success"){
                            window.location.replace("/myaccount");
                        }
                    },
                    error: function(){
                        $("#status").html("Failed.");
                    }
            });
        });

    });
</script>

ReCaptcha には「データ コールバック」を設定する必要がありますが、既存の「.submit(function(event)」関数とバインドする方法がわかりません。
「onSubmit()」トリックは機能しませんでした。「ajax を無視します」 「

datas」変数内の「g-recaptcha-response」値を送信して、test.php に POST するにはどうすればよいですか?

4

3 に答える 3