javascript - 淡出，通过 AJAX 更新，淡入使用 Prototype 的 div

Question

我有一个 div，我想通过 AJAX 更新其内容。为了使过渡平滑，我想淡出旧内容，然后用 AJAX 响应更新它，然后再淡入。

我的第一次尝试如下；但当然 AJAX 可以在 fade() 调用之前完成，导致 appear() 无法正确触发并且结束状态被淡出。我怎样才能让这个工作如我所愿？

target = $('card_text_' + index);
new Ajax.Request('/games/card_text', 
         {asynchronous:false, 
          evalScripts:true, 
          method:'get', 
          parameters:'type=' + value,
          onCreate: function(){target.fade()},
          onSuccess: function(e){target.update(e.responseText).appear()}
          });

编辑:为了完整起见，我将 Prototype 与 script.aculo.us 结合使用

Answer 1

我已经找到了我想要的解决方案，尽管文档并不容易。事实证明，所有 script.aculo.us 效果都有一个 set of callbacks ，包括 afterFinish。我的代码变成了:

target = $('card_text_' + index);
new Effect.Fade(target, {afterFinish: function(){
  new Ajax.Updater(target, '/games/card_text', 
           {asynchronous:false, 
            evalScripts:true, 
            method:'get', 
            parameters:'type=' + value,           
            onSuccess: function(e){new Effect.Appear(target)}
            });