我正在集成mailchimp API，只是想通过在提交数据时显示加载动画制作工具来使其更加用户友好。我已经让它显示了动画师，并且在成功时，它用动画隐藏了div。
问题是如果脚本返回错误，例如电子邮件不正确，我也需要加载器隐藏 - 它不是基于我到目前为止所尝试的。
我需要在以下脚本中为动画师插入hide（）函数的任何想法？
<script type="text/javascript">
var fnames = new Array();var ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';var err_style = '';
try{
err_style = mc_custom_error_style;
} catch(e){
err_style = 'margin: 1em 0 0 0; padding: 1em 0.5em 0.5em 0.5em; background: ERROR_BGCOLOR none repeat scroll 0% 0%; font-weight: bold; float: left; z-index: 1; width: 80%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: ERROR_COLOR;';
}
$(document).ready( function($) {
var options = { errorClass: 'mce_inline_error', errorElement: 'div', errorStyle: err_style, onkeyup: function(){}, onfocusout:function(){}, onblur:function(){} };
var mce_validator = $("#mc-embedded-subscribe-form").validate(options);
options = { url: 'http://somethingorother.us2.list-manage.com/subscribe/post-json?u=a9cf617dfdf4f2eaoeuaoeub75b&id=4b3aoeu1e2a0&c=?', type: 'GET', dataType: 'json', contentType: "application/json; charset=utf-8",
beforeSubmit: function(){
$('#mc_embed_signup .mc-field-group p').hide();
$('#subscribe_loading').fadeIn();
$('#mce_tmp_error_msg').remove();
$('.datefield','#mc_embed_signup').each(
function(){
var txt = 'filled';
var fields = new Array();
var i = 0;
$(':text', this).each(
function(){
fields[i] = this;
i++;
});
$(':hidden', this).each(
function(){
if ( fields[0].value=='MM' && fields[1].value=='DD' && fields[2].value=='YYYY' ){
this.value = '';
} else if ( fields[0].value=='' && fields[1].value=='' && fields[2].value=='' ){
this.value = '';
} else {
this.value = fields[0].value+'/'+fields[1].value+'/'+fields[2].value;
}
});
});
return mce_validator.form();
},
success: mce_success_cb
};
$('#mc-embedded-subscribe-form').ajaxForm(options);
});
function mce_success_cb(resp){
$('#subscribe_loading').hide();
$('#mce-success-response').hide();
$('#mce-error-response').hide();
if (resp.result=="success"){
$('#mce-'+resp.result+'-response').show();
$('#mce-'+resp.result+'-response').html(resp.msg);
$('#mc-embedded-subscribe-form').each(function(){
this.reset();
});
} else {
var index = -1;
var msg;
try {
var parts = resp.msg.split(' - ',2);
if (parts[1]==undefined){
msg = resp.msg;
} else {
i = parseInt(parts[0]);
if (i.toString() == parts[0]){
index = parts[0];
msg = parts[1];
} else {
index = -1;
msg = resp.msg;
}
}
} catch(e){
index = -1;
msg = resp.msg;
}
try{
if (index== -1){
$('#mce-'+resp.result+'-response').show();
$('#mce-'+resp.result+'-response').html(msg);
} else {
err_id = 'mce_tmp_error_msg';
html = '<div id="'+err_id+'" style="'+err_style+'"> '+msg+'</div>';
var input_id = '#mc_embed_signup';
var f = $(input_id);
if (ftypes[index]=='address'){
input_id = '#mce-'+fnames[index]+'-addr1';
f = $(input_id).parent().parent().get(0);
} else if (ftypes[index]=='date'){
input_id = '#mce-'+fnames[index]+'-month';
f = $(input_id).parent().parent().get(0);
} else {
input_id = '#mce-'+fnames[index];
f = $().parent(input_id).get(0);
}
if (f){
$(f).append(html);
$(input_id).focus();
} else {
$('#mce-'+resp.result+'-response').show();
$('#mce-'+resp.result+'-response').html(msg);
}
}
} catch(e){
$('#mce-'+resp.result+'-response').show();
$('#mce-'+resp.result+'-response').html(msg);
}
}
}
</script>
答案 0 :(得分：1)
ajaxForm plugin 明确表示您可以使用 .ajax()
请注意，Options Object也可用于将值传递给jQuery的$ .ajax方法。如果您熟悉$ .ajax支持的选项，则可以在传递给ajaxForm和ajaxSubmit的选项对象中使用它们。
因此，与在success上执行的函数相同，您可以创建一个在error上执行的函数。看看下面的jQuery .ajax() 页面：
<强> error(XMLHttpRequest, textStatus, errorThrown)
请求失败时要调用的函数。该函数传递三个参数：XMLHttpRequest对象，描述发生的错误类型的字符串和可选的异常对象（如果发生）。第二个参数的可能值（除了null）是“timeout”，“error”，“notmodified”和“parsererror”。这是 Ajax Event 。
在您的情况下，只需在成功时使用相同的方式隐藏错误图像......例如：
// ... code
options = {
// ... code
success: function(responseXML)
{ mce_success_cb(responseXML); }, // <== mce_... takes an argument
error: function() { $('#subscribe_loading').hide();
// any other stuff to do on error;
}
};
// ... code
您可以使用参数(XMLHttpRequest, textStatus, errorThrown)为匿名函数获取有关错误的信息并存储和/或显示错误。
如果你想处理成功的AJAX响应的情况，但是响应中有错误，请更改mce_success_cb() ...看起来它已经设置为处理这种错误，所以这只是添加你想要的额外功能的问题：
// ...
function mce_success_cb(resp){
$('#subscribe_loading').hide();
$('#mce-success-response').hide();
$('#mce-error-response').hide();
if (resp.result=="success"){
// ...
// This stuff happens if resp.result == "success"
// ...
} else {
// Add in the error handling functionality you want here
var index = -1;
var msg;
//...
一些常见问题
小心计算所有的parens和括号，因为看起来你打开了一些。
准备好文档的开头应该如下：
$(document).ready( function() { // <== No need to pass anything to this
// This will all be executed when the document is ready.
// ...
}); // <== Maker sure to close all parens and brackets!!!
此外，success回调将为您提供多个参数，因此您无法使用对success回调的函数的引用，它看起来更像是这样：
success: function(responseXML)
{
mce_success_cb(responseXML);
}
请务必查看描述传递给success回调的参数的 AJAXForm plugin documentation 。
答案 1 :(得分：0)
我没有阅读您的任何代码，但您是否尝试过complete()函数的jQuery.ajax方法？无论服务器发送的错误代码如何，它都会在加载数据后调用该函数。
complete(XMLHttpRequest, textStatus)
请求完成时要调用的函数（执行成功和错误回调之后）。该函数传递两个参数：XMLHttpRequest对象和分类请求状态的字符串（“success”，“notmodified”，“error”，“timeout”或“parsererror”）。这是一个Ajax事件。