除非没有空格,否则Javascript代码无效。为什么?

时间:2015-07-04 05:55:25

标签: javascript html css wordpress wordpress-plugin

好的,所以我在我的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/

0 个答案:

没有答案