javascript - 在 jQuery Form 中， 'success' 在 'beforeSubmit' 完成之前被调用

Question

我正在使用 jQuery 表单插件上传图片。我已经分配了淡入淡出动画来发生 beforeSubmit 回调，但由于我在本地运行，它没有时间在调用 success 函数之前完成。

我在 fade(); 调用中使用回调函数来确保一个淡入淡出在下一个淡入淡出开始之前完成，但这似乎并不能保证调用它的函数完成了。

我做错了什么吗？ beforeSubmit 不应该在提交 ajax 调用之前完成吗？

这是两个回调:

提交前:

function prepImageArea() {
  if (userImage) {
    userImage.fadeOut(1500, function() {
      ajaxSpinner.fadeIn(1500);
    });
  }
}

成功:

function imageUploaded(data) {
  var data = evalJson(data);
  userImage.attr('src', data.large_thumb);
  ajaxSpinner.fadeOut(1500, function() {
    userImage.fadeIn(1500);
  });
}

Answer 1

我认为您可能对那些淡入淡出动画太感兴趣了 :)...在 beforeSubmit 中设置了 fadeOut，但该函数立即返回导致提交发生。我猜上传时间不到 3 秒，导致新图像在您的动画完成之前出现。

因此，如果您真的想要这种效果，那么您将需要执行图像淡出、微调器淡入，并在完成后触发上传。像这样:

if (userImage) {
  userImage.fadeOut(1500, function() {
    ajaxSpinner.fadeIn(1500, function(){
        //now trigger the upload and you don't need the before submit anymore
    });
  });
}
else {
   // trigger the upload right away
}