0

单击“发送”按钮时，我的 Mailchimp 表单未提交。它仅在我删除 javascript 时提交，但随后我将被转发到 mailchimp 注册页面：http ://example.us6.list-manage.com/subscribe/post

我不希望这样，因为我希望 Ajax 在功能上保持完整。因此，如果用户输入电子邮件地址并单击“发送”，他需要在不离开页面的情况下收到他订阅了新闻通讯的消息。

请看这个例子

html:

<!DOCTYPE html>
<html>
<head>
  <script src=//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js></script>
<meta charset=utf-8 />
<title>Mailchimp newsletter</title>

</head>
<body>
<form class="myform" action="http://example.us6.list-manage.com/subscribe/post" method="POST">
  <input type="hidden" name="u" value="47cdcabfbe6291e5cdaf8d06e">
  <input type="hidden" name="id" value="6d2a3690d2">
  <input type="email" id="email" name="email" value=""  placeholder="your email address please" required>
  <input type="submit" value="Send" name="submit" id="submit-btn">
</form>
  <div id=message></div>
</body>
</html>

CSS：

#message{position:absolute;width:185px;right:0;top:30px;color:red}

javascript:

-$(document).ready(function(){$('#submit-btn').on('click',function(e){e.preventDefault();var email=$('#email').val(),validate=new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][\d]\.|1[\d]{2}\.|[\d]{1,2}\.))((25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\.){2}(25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\]?$)/i);if(!email){
$('#message').text('Please enter your email address');return;}
if(validate.test(email)){

$.ajax({
      type:"GET",
      url: "http://example.us6.list-manage2.com/subscribe/post-json?c=?",
      data: $form.serialize(),
      dataType:'json',
      contentType: "application/json; charset=utf-8",
      success:function(data){$('#message').text(data['message']);if(data['success']){}}});}else{$('#message').text('Your email address seems to be invalid');}});});
4

0 回答 0