フォームの送信中に見えないreCaptchaのキャッチされていないタイプのエラー

Question

私はgoogleによって新しい不可視のrecaptchaを実装しようとしています。

しかし、私は入力が必要なので、recaptchaを実行する前にフォームを検証する必要があります。

私はそのようなreCAPTCHAのコールバック関数にエラーが発生しました：

Uncaught TypeError: document.getElementById() submit is not a function

は、どのように私は実行検証し、reCAPTCHAの後にフォームを送信することができますか？

HTML：

​​

Javascriptを：

function onSubmit(token) { 
    alert('Thanks ' + document.getElementById('field').value + '!'); 
    document.getElementById('form').submit(); // This is error line 
} 

function validate(event) { 
    event.preventDefault(); 
    if (!document.getElementById('field').value) { 
    alert("Please enter your name."); 
    } else { 
    grecaptcha.execute(); 
    } 
} 

function onload() { 
    var element = document.getElementById('submit'); 
    element.onclick = validate; 
} 

JSFiddle：http://jsfiddle.net/dp1cLh28/6/

Answer 1

私は解決策を見つけました。

問題は、.submit()機能と競合するsubmit（button id="submit"）という名前のボタンIDです。

ボタンIDを変更すると機能します。

変更ボタンID：私の場合は

<button id='action'>Submit</button> 
      ^submit > action or whatever 

Answer 2

は、私の代わりに、ボタンの形で（タイプ=「送信」）タグを入力していました。入力の名前がsubmit関数と競合していました。名前はtype属性から「提出」する不履行たので、私は、明示的にタグの名前を指定する必要がありました

<input type="submit" name="anything-except-submit"> 

：

ソリューションは、inputタグに「提出」とは異なる名前を与えることでした。

ユーザーが正常にreCAPTCHAの解決時にコールバックのみ呼び出されることに注意することも重要であるので、あなたのコールバックは、任意のフォームの検証を行っている場合は、検証が失敗した場合は、

grecaptcha.reset(); 

を呼び出す必要があります。つまり、ユーザーはreCAPTCHAを再度解決する必要がありますが、そうでなければ、修正後にフォームを送信できなくなります。