ajax - 如何在 AJAX 中发布数据?
问题描述
我正在将一个简单的 Mailchimp 注册集成到我正在开发的网站上。
单击提交时,我希望表单只是使用 AJAX 将电子邮件地址发送到 Mailchimp,而不是被重定向。我对 AJAX 几乎一无所知。我在这里找到了解决方案,但它仍然不起作用。单击提交按钮仍然重定向,现在到未找到的页面 (404)。
这是我的 HTML:
<!-- Begin Mailchimp Signup Form -->
<div id="mc_embed_signup">
<form action="https://outlook.us10.list-manage.com/subscribe/post-json?u=46fbb562c588c268ad0d3f670&id=007ec4fc87&c=?" method="get" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" novalidate>
<div id="mc_embed_signup_scroll">
<div class="mc-field-group">
<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL" placeholder="Enter your email adress">
</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;" aria-hidden="true"><input type="text" name="b_46fbb562c588c268ad0d3f670_007ec4fc87" tabindex="-1" value=""></div>
<div class="clear"><button type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"><img src="./assets/svg/arrow-white.svg" alt=""></button></div>
</div>
</form>
<!--End mc_embed_signup-->
和 JS:
$(document).ready(function() {
var $form = $('mc-embedded-subscribe');
if ($form.length > 0) {
$('button input[type="submit"]').bind('click', function(event) {
if (event) event.preventDefault();
register($form);
});
}
});
function register($form) {
$.ajax({
type: $form.attr('method'),
url: $form.attr('action'),
data: $form.serialize(),
cache: false,
dataType: 'json',
contentType: "application/json; charset=utf-8",
error: function(err) {
alert("Could not connect to the registration server. Please try again later.");
},
success: function(data) {
if (data.result != "success") {
// Something went wrong, do something to notify the user. maybe alert(data.msg);
} else {
// It worked, carry on...
}
}
});
}
解决方案
关闭!
问题来自一个小错误:var $form = $('mc-embedded-subscribe');
->var $form = $('#mc-embedded-subscribe-form');
我错过了#
并且没有选择正确的 ID。
推荐阅读
- python - Python3 解析电子邮件正文的方式与 Python2 不同
- angular - 如何根据列的布尔值过滤此表?
- jquery - JQuery, hide() 不工作,但 remove() 是
- angular - 未捕获的类型错误:无法读取未定义的属性“团队”抛出 - 业力
- android - 持续时间选择器对话框或组件?
- r - 为什么 ggplotly 的参数工具提示没有排序?
- ruby - 修复失败的 ruby gem 安装
- python - Python通过串行端口写入十六进制而不是ASCII
- c++ - 使用数组构造函数的模板作为函数返回类型
- node.js - 如何在 node.js 中通过 HTTP 发送原始二进制数据?