在 jQuery 表单中，在 'beforeSubmit' 完成之前调用 'success'

Posted 2023-05-08

【中文标题】在 jQuery 表单中，在 \'beforeSubmit\' 完成之前调用 \'success\'

【英文标题】：In jQuery Form, 'success' is being called before 'beforeSubmit' is finished在 jQuery 表单中，在 'beforeSubmit' 完成之前调用 'success'

【发布时间】：2010-09-13 07:28:29

【问题描述】：

我正在使用 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);
  );

【参考方案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

【参考方案2】：

即使在提交表单之前调用了 beforeSubmit 回调，userImage.fadeOut 函数也是同步的（即，它产生一个单独的执行线程来执行淡入淡出动画，然后继续执行）并立即返回。淡入淡出动画需要 1.5 秒才能完成，当您在 localhost 上运行时，ajax 响应的返回速度快于 1.5 秒，因此您不会看到动画，在现实世界的应用程序中，ajax 请求几乎不可能花费不到 1.5 秒，所以你很好:)