0

現在、アニメーションを実行し、アニメーションが終了したら他のコード ロジックを実行する showAuthorInfo という関数があります。

self.showAuthorInfo = function(){
  var authorID = $authorLink.attr('data-author-id'); //PL-INT - determine what info needs be captured here
  var isActive = $modalInfoWindow.hasClass('active');
  self.$modalInfoWindow.animate({ 'bottom': '0px' },200,function(){

    self.$modalInfoWindow.addClass('active');
    self.loadAuthorInfo(authorID);

  })

}

ただし、アニメーションが完了するたびにさまざまなコールバックを実行して、さまざまな関数呼び出しを介してこのモーダル ウィンドウを表示および非表示にしたいので、アニメーションを関数にラップしたいと思います。問題は、上記の関数を使用して、アニメーションが発生するカスタム関数を呼び出し、そのアニメーション関数がこの関数に値を返してから続行できるかどうかです。

関数を複数の関数に分割しますが、複雑になる可能性があるように感じます。特に、すべてのケースに適用されるとは限らない特定の関数固有のパラメーターを渡す必要があるためです (たとえば、上記のコードで、アニメーション関数を呼び出してから loadAuthorInfo 関数を呼び出すつもりでしたが、アニメーション関数は、showAuthorInfo によって呼び出される場合にのみ authorID を必要とする場合でも、loadAuthorInfo に渡すことができるように authorID を受け入れる必要があります)。

ここに何か推奨事項はありますか？

やりたくないことの例:

self.showAuthorInfo = function(){
  var authorID = $authorLink.attr('data-author-id'); //PL-INT - determine what info needs be captured here
  var callback = self.displayAuthorContent();
  self.animateInfoWindow(authorID,callback);
}

self.animateInfoWindow = function(authorID,callback){
  self.$modalInfoWindow.animate({ 'bottom': '0px' },200,function(){

    //create conditional where if there's an authorID, pass it to the callback function, otherwise just call the callback function without parameters

  })
}
4

3 に答える 3

0

アニメーション化するコールバックを渡すだけで、不要な関数のラッピングを回避できます。

    self.showAuthorInfo = function(){
      var authorID = $authorLink.attr('data-author-id'); //PL-INT - determine what info needs be captured here
      var callback = self.displayAuthorContent();
      self.animateInfoWindow(authorID,function(){
        //do something here
      });
    }

    self.someOtherFunction = function(){
      var authorID2 = $authorLink2.attr('data-author-id2'); //PL-INT - determine what info needs be captured here
      var callback2 = self.displayAuthorContent2();
      self.animateInfoWindow(authorID2,function(){
        //do something different
      });
    }


    self.animateInfoWindow = function(authorID,callback){
      self.$modalInfoWindow.animate({ 'bottom': '0px' },200,callback)
    }

ここにフィドルがあります：http://jsfiddle.net/95kwD/

あなたが何を達成したいのかよくわかりません：

var callback = self.displayAuthorContent();

コールバック関数の全体的な目的である関数を呼び出す前に、コールバックを呼び出しています。多分それは関数variableの名前だけです

于 2013-04-08T20:55:25.953 に答える
0

animateWindow を可能な限り一般的なものに保ちたい場合は、コールバックのみを使用し、パラメーターは使用しません。コールバックは、柔軟性を確保するために、よりコンテキストを意識することができます。 

self.showAuthorInfo = function(){
   var authorID = $authorLink.attr('data-author-id');
   var customCallback = function(){
       self.loadAuthorInfo(authorID);
   };
   self.animateInfoWindow(customCallback);
}
self.animateInfoWindow = function(callback){
   self.$modalInfoWindow.animate({ 'bottom': '0px' },200,callback);
}
于 2013-04-08T21:13:29.967 に答える