SweetAlert提示中的Google reCaptcha

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了SweetAlert提示中的Google reCaptcha相关的知识,希望对你有一定的参考价值。

我正在使用一个功能,该功能需要使用一个甜美的警报弹出框来进行reCaptcha验证,但它遇到了错误]

Uncaught Error: reCAPTCHA placeholder element must be an element or id

我一直在寻找导致此错误的原因,并且我注意到是由于尝试生成reCaptcha元素时尚未加载该元素,所以>

function confirmBox() {
    var div = document.createElement('div');
    div.id = 'recaptcha';
    div.onload = genRecaptcha();

    swal({
        title: "Are you sure?",
        content: div,
        icon: "warning",
        buttons: true,
        dangerMode: true,
    })
}

function genRecaptcha() {
    console.log($('#recaptcha').attr('id'));
    grecaptcha.render('recaptcha', {
        'sitekey': '6Le2ZFUUAAAAAEV4IM_5weEnXg4gVplan2Atgiaj'
    });
}

$('#btn1').click(confirmBox);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://www.google.com/recaptcha/api.js"></script>

<button id="btn1">Submit</button>

我正在尝试将genRecaptcha函数与onload触发器一起使用,但似乎无法获取该元素。

弹出框完全加载后,有什么方法可以执行功能?或这里我做错了什么。

对此将提供任何帮助。谢谢。

我正在使用一个函数,该函数需要使用一个甜美的警报弹出框来进行reCaptcha验证,但是它遇到了Uncaught Error的错误:reCAPTCHA占位符元素必须是我曾经使用过的元素或ID ...

答案
这是SweetAlert2的解决方案-SweetAlert支持的分支:

另一答案
使用$(element).ready中的jquery代替.onload来解决问题

以上是关于SweetAlert提示中的Google reCaptcha的主要内容,如果未能解决你的问题,请参考以下文章

超酷消息警告框插件(SweetAlert)

33Flask实战第33天:sweetalert提示框

SweetAlert的入门

SweetAlert2 第一次提示为啥不在中间

一百零三:CMS系统之使用sweetalert提示框优化返回结果

Sweetalert - Javascript中的调用函数[关闭]