其他所有內容加載完畢后，加載Recaptcha

Question

使用Recaptcha的默認方式是：

<script src="http://www.google.com/recaptcha/api/challenge?k=publickey"></script>

您希望Recaptcha出現的位置。 但是，我希望它顯示在頁面的中間，但是我不希望它阻止頁面的其余部分。

我如何最后加載Recaptcha？

我已經加載了jQuery。

Answer 1

在JQuery中找到了此代碼。 當文檔准備就緒時，則意味着頁面已完全加載。

// WHEN THE DOM HAS LOADED FIRE THE reCapInsert FUNCTION TO INSERT THE reCAPTCHA
$( document ).ready(function(){
    reCapInsert();
});

// WHEN CALLED THIS INSERTS THE reCAPTCHA INTO THE PAGE
function reCapInsert(){
    Recaptcha.create('YOUR_PUBLIC_KEY_HERE',  // public key
    'recap',
        {
            theme: 'clean',
            callback: Recaptcha.focus_response_field
        }
);
}

您在HTML頁面中所做的全部工作都將放置此代碼，它將在該位置生成一個ReCaptcha。 （不要忘記在頁面的標題中包含recaptcha javascript。）

   <!-- The reCAPTCHA wrapper is here - this is required!! -->
    <div id="recap"></div>

找到了通過$(document).ready()加載此非Ajax版本的示例

$(document).ready(function(){
    var json = {
        type: "text/javascript",
        scriptSrc: "http://www.google.com/recaptcha/api/challenge?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n",
        id: "theFrame",
        iframeSrc: 'http://www.google.com/recaptcha/api/noscript?k=6LcXq-oSAAAAAOgwSIew_xq6xkv1QUxrZbRcMz6n'
    };

    var script = document.createElement('script');
    script.type = json.type;
    script.src = json.scriptSrc;

    $('<iframe>', {
       src: json.iframeSrc,
       id:  json.id,
       frameborder: 0,
        height: 300,
        width: 500
       }).appendTo('#recap');
});

JSFiddle： JSfiddle

有關更多信息，請查看原始源： 混合jQuery和reCaptcha