建站资源下载详情
为您免费提供多种建站资源下载,包括网站模板下载、前端插件下载和字体下载!您只需注册为会员即可任意下载!

Mailchimp异步辅助JQuery插件AjaxMailChimp

来源:易助科技网浏览量:11收藏

简介


AjaxMailChimp是一个jQuery插件,将mailchimp简单(一个电子邮件输入)与AJAX集成,因此没有页面刷新,也没有重定向到默认的mailchimp页面。



使用


用法示例


不需要API密钥,您只需将标准mailchimp生成的表单放入您的代码中(根据需要自定义外观)并在表单"action"属性中更改post?u=为post-json?u=,然后在表单操作结束时附加&c=?以解决任何跨域问题.另外需要注意的是,提交表单时必须使用GET而不是POST。

form表单看起来像这样


<form action="http://xxxxx.us#.list-manage1.com/subscribe/post-json?u=xxxxx&id=xxxx&c=?" method="get" ... >


Mail Chimp将返回一个包含2个值的json对象:'result' - 这将指示请求是否成功(只见过2个值,"error"和"success")和'msg' - 一条消息描述结果。

用jQuery提交表单类似这样:


$(document).ready( function () {
  // I only have one form on the page but you can be more specific if need be.
  var $form = $('form'); 
  if ( $form.length > 0 ) {
    $('form input[type="submit"]').bind('click', function ( event ) {
      if ( event ) event.preventDefault();
      // validate_input() is a validation function I wrote, you'll have to substitute this with your own. 
      if ( validate_input($form) ) {
        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...
      }
    }
  });
}