Question

我将ReCAPTCHA添加到具有多个联系表单的（Bootstrap Jekyll）网站。页脚中有一个弹出模式，偶尔会联系我们＆＃34;部分，以及＆＃34;请求有关____＆＃34;的更多信息。在几页上。

由于我在一个页面上有多个联系表单，因此我需要显式呈现每个ReCAPTCHA。这是代码：

在我的javascript中：

var CaptchaCallback = function() {
    grecaptcha.render('RecaptchaField1', {'sitekey' : 'my_sitekey'
    });

    grecaptcha.render('RecaptchaField2', {'sitekey' : 'my_sitekey'
    });
};

页脚（包含在所有页面中）

<div id="RecaptchaField1"></div>

（并在页脚的底部）

<script src='https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit' async defer></script>

这在有两个单独的联系表单的页面上运行良好（即我在页面上有另一个div，其ID为RecaptchaField2），但如果我登陆的页面只有一个联系表单， console抛出错误（Uncaught Error：ReCAPTCHA占位符元素必须是元素或id）。

ReCAPTCHA似乎无论如何都有效，但任何人都可以帮我理解导致此错误的原因吗？我所做的所有研究都表明它是从导入图书馆两次，但我假设情况并非如此，因为问题只出现在某些页面而不是其他页面上。

谢谢！

Answer 1

这对我有用：

var CaptchaCallback = function() {
    if ( $('#RecaptchaField1').length ) {
        grecaptcha.render('RecaptchaField1', {'sitekey' : 'my_sitekey'
        });
    }
    if ( $('#RecaptchaField2').length ) {
       grecaptcha.render('RecaptchaField2', {'sitekey' : 'my_sitekey'
       });
    }
};

Answer 2

我遇到了同样的问题，但该解决方案对我不起作用，但是我找到了一个解决方案。

事实是我使用了wordpress Contact表格7插件，不幸的是，我在集成部分写了Recaptcha的键。

这使函数recaptcha / api.js被调用两次，并导致此错误。

因此，我刚刚删除了该插件并重新安装它，而未填写集成部分，而是在header.php和footer.php文件中调用了recatpcha，并且有效:)

别忘了将按钮recaptcha放在联系表中

public ColorRGB[] olas(ColorRGB color1, ColorRGB color2) {          
    ColorRGB[] colordevuelto=new ColorRGB[30];
    byte longuitud=30;  
    //so we get two colors and fade and merge them at some point
    for(byte h=0;h<longuitud;h++) {
        byte rojofinal= map(color1.getRed(),color2.getRed(),(byte) 0,longuitud,h);  
        byte azulfinal= map(color1.getBlue(),color2.getBlue(),(byte) 0,longuitud,h);
        byte verdefinal= map(color1.getGreen(),color2.getGreen(),(byte) 0,longuitud,h);
        System.out.println("Led num: "+h+"Componente roja: "+ Byte.toString(rojofinal)+" componente verde: "+Byte.toString(verdefinal)+" componente azul "+Byte.toString(azulfinal));
        colordevuelto[h]=new ColorRGB(rojofinal,verdefinal,azulfinal);
    }
    return colordevuelto;   //devuelve un array de color fadeado a lo largo de 30 pixeles
}
private byte map (byte xinicio, byte xfinal,byte ymin,byte ymax, byte point) {
    //this funtion is for mapping from one side to another
    if(point > ymax || point <ymin) {
        return 0;   //Esto no deberia pasar nunca
    }

    if(xfinal>xinicio) {
        return (byte) (((xfinal-xinicio)*point)/(ymax-ymin));
    }
    else {
        return (byte) (((xfinal-xinicio)*point)/(ymax-ymin)+(xinicio-xfinal));
    }


}

Answer 3

您也可以以纯Java脚本的方式使用它

grecaptcha.render(document.getElementById('RecaptchaField1'), {
      'sitekey' : 'my_sitekey'
    });

未捕获的错误：ReCAPTCHA占位符元素必须是元素或id

3 个答案: