javascript - Mailchimp 注册表单订阅按钮不起作用

Question

这是我的 JSFIDDLE :

当我运行此代码时，当我单击订阅按钮时，什么也没有发生。

我正在尝试更改放置代码的位置，但仍然找不到错误。

<div class='popup'>
<div class='cnt223'>
<img src='http://s14.postimg.org/w3j8ay2bh/1440412582_cross_24.png' 
alt='quit' class='x' id='x' />
<p>
<div id="mc_embed_signup">
<form action"//wafytech.us11.list-manage.com/subscribe
/post?u=4cc1d72c9827dd3ef80675e4c&amp;id=4d5daa8c14" 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 class="mc-field-group">
    <label for="mce-FNAME">First Name </label>
    <input type="text" value="" name="FNAME" class="" id="mce-FNAME">
</div>
<div class="mc-field-group">
    <label for="mce-LNAME">Last Name </label>
    <input type="text" value="" name="LNAME" class="" id="mce-LNAME">
</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_4cc1d72c9827dd3ef80675e4c_4d5daa8c14" tabindex="-1" value=""></div>
    <div class="clear">
    <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-
subscribe" class="button"></div>
    </div>
</form>
</div>
<br/>
</p>
</div>
</div>

Answer 1

该错误是因为您有 http://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js在文档完成加载之前加载。

在第 196 行，您有以下内容:

    getAjaxSubmitUrl: function() {
        var url = $("form#mc-embedded-subscribe-form").attr("action");
        url = url.replace("/post?u=", "/post-json?u=");
        url += "&c=?";
        return url;
    },

它在 url = url.replace("/post?u=", "/post-json?u="); 上给我错误，因为 $("form# mc-embedded-subscribe-form") 由于文档未加载，无法获取正确的元素。因此，.attr("action") 将返回 undefined。尝试向整个代码添加 .ready 事件监听器。

此外，正确的方法是$("#mc-embedded-subscribe-form")。

<小时/>

除此之外，您的 HTML 中还包含以下内容:

<form action"[...]">

您忘记了 action 与其值之间的 =。它应该看起来像这样:

<form action="[...]">

注意那里的=!