好的,所以我在我的Wordpress网站上遇到了一个非常奇怪的错误,希望这只是我的无知,因为这看起来太奇怪了。
所以我正在处理几个输入标签以及ReCaptcha表单的样式。我在https://developers.google.com/recaptcha/old/docs/customization找到了一些我一直关注的文档。基本上我想要的是在该链接上列出的干净主题,并根据某些事件显示/隐藏验证码。
我确实认识到文章的顶部提到这个版本的api已经过时了,但是我使用的插件在代码中纠缠了一些重新编码代码,所以我想我会首先尝试这个,而不是对它进行重大修改插件。
所以这是我正在使用的代码
<!-- Code added by me-->
<script type="text/javascript">
var RecaptchaOptions = {
theme : 'clean'
};
function toggleCaptcha(inputField)
{
alert('working');
}
</script>
<!-- End code added by me -->
<script>
function validateGoodNewsUser(frm, requireName) {
requireName = requireName || false;
if(requireName && frm.goodnews_name.value=="") {
alert("Please provide name");
frm.goodnews_name.focus();
return false;
}
if(frm.email.value=="" || frm.email.value.indexOf("@")<1 || frm.email.value.indexOf(".")<1) {
alert("Please provide a valid email address");
frm.email.focus();
return false;
}
// check custom fields
var req_cnt = frm.elements["required_fields[]"].length; // there's always at least 1
if(req_cnt > 1) {
for(i = 0; i<req_cnt; i++) {
var fieldName = frm.elements["required_fields[]"][i].value;
if(fieldName !='') {
var isFilled = false;
// ignore radios
if(frm.elements[fieldName].type == 'radio') continue;
// checkbox
if(frm.elements[fieldName].type == 'checkbox' && !frm.elements[fieldName].checked) {
alert("This field is required");
frm.elements[fieldName].focus();
return false;
}
// all other fields
if(frm.elements[fieldName].value=="") {
alert("This field is required");
frm.elements[fieldName].focus();
return false;
}
}
}
}
return true;
}
</script>
<form method="post" class="goodnews-front-form" onsubmit="return validateGoodNewsUser(this,false);">
<div><label>Your Name:</label> <input type="text" name="goodnews_name"></div>
<div><label>*Your Email:</label> <input type="text" name="email" onfocus="toggleCaptcha(this)"></div>
<p><script type="text/javascript" src="<!--Captcha api url here-->"></script>
<noscript>
<iframe src="<!--Captcha api url here-->" height="300" width="500" frameborder="0"></iframe><br/>
<textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
<input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
</noscript></p>
<div><br>
<input type="submit" value="Subscribe">
</div>
<input type="hidden" name="goodnews_subscribe" value="1">
<input type="hidden" name="list_id" value="1">
<input type="hidden" name="required_fields[]" value="">
</form>
所以我遇到的问题是当我加载页面时,我看到ReCaptcha的干净主题,当我在电子邮件的输入框内单击时,警报显示出来。但是如果我通过添加像这样的单个空格来改变我添加的代码
<!-- Code added by me-->
<script type="text/javascript">
var RecaptchaOptions = {
theme : 'clean'
};
<<<<<<<< Single new line space added.
function toggleCaptcha(inputField)
{
alert('working');
}
</script>
整个事情中断,页面加载标准的红色ReCaptcha,我的函数不被调用。
我不介意不使用空格,但这似乎很奇怪,空间会有所不同。我在这里错过了什么吗?这是由过时的api引起的吗?
编辑:
我被要求尝试让jsfiddle工作(或不工作???)。除了表单和函数调用之外,我删除了所有内容。即使ReCaptcha被取出,我仍然无法让它调用该功能。这可能是我对jsfiddle缺乏了解,或者它可能更接近真正的问题。 https://jsfiddle.net/b257779t/