javascript - MailChimp JS 验证不起作用

Question

我正在使用 MailChimp 的嵌入式表单之一，复制到 wordpress 弹出窗口生成器中。问题是 MailChimp 表单中的 JS 导致错误，因此表单验证不起作用。这是错误:

Uncaught TypeError: Cannot read property 'replace' of undefined
// This error occurs in the file: mc-validate.js:198

这是完整的表单代码:

    <!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-081711.css" rel="stylesheet" type="text/css">
<style type="text/css">
    #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif;  width:500px;}
    /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
       We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
    <div id="mc_embed_signup_scroll">
    <h2>Subscribe to our mailing list</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
    <label for="mce-EMAIL">Email Address  <span class="asterisk">*</span>
</label>
    <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
    <div id="mce-responses" class="clear">
        <div class="response" id="mce-error-response" style="display:none"></div>
        <div class="response" id="mce-success-response" style="display:none"></div>
    </div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
    <div style="position: absolute; left: -5000px;"><input type="text" name="b_c86e002570c2075b57186bd84_ee52af27a3" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script>
<script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->

编辑:我用于弹出窗口的插件是 Indeed Smart PopUp

Answer 1

实际上，如果脚本被移动到页面的页脚，错误就会被纠正，但这是合乎逻辑的，因为脚本在 Dom 中创建之前调用了一个变量，逻辑上它的状态将始终是未定义的。

如果您像我一样想要将脚本放在网络标题中，则必须为 url 变量指定一个值，以防它不可用，并且该值必须从操作中获取表单字段，就这么简单。

if (typeof url == 'undefined') {url = "https://yoursite.us85.list-manage.com/subscribe/post?u=13s79c67xxb4c8ad2339ce34a&id=d1htsl3a46";}

该函数如下所示:

getAjaxSubmitUrl: function () {var url = $ ("form # mc-embedded-subscribe-form"). attr ("action");if (typeof url == 'undefined') {url = "https://yoursite.us85.list-manage.com/subscribe/post?u=13s79c67xxb4c8ad2339ce34a&id=d1htsl3a46";}url = url.replace ("/ post? u =", "/ post-json? u =");url + = "& c =?";return url;},

希望对您有帮助!