プラグインが期待通りに機能しない

Question

私は以下のコードを使用して一連の要素を循環させていました。

$(this).next().show().animate({top: '25px'},250,function(){ 
       $(this).addClass('active'); 
      }); 

が、これは私が再びを通じて要素のリストの最後に、サイクルを取得するために、必要に応じて制限され、私はこのプラグインを書いた：私が持っていたときを検出するためには

(function($){ 
    $.fn.extend({ 
     rotater: function(class_check){ 
      return this.each(function(){ 
       if($(this).next().hasClass(class_check)){ 

        return $(this).next(); 
       } else { 

        return $(this).parent().children().first(); 
       } 
      }); 
     } 
    }); 
})(jQuery); 

を私の望むセット（すべて共通のクラスを共有しています）の終わりに達しました。もしそうなら、再びサイクル全体を開始する最初のオブジェクトをつかんでください。

私はに呼び出し元のコードを変更：

$(this).rotater('common_class').show().animate({top: '25px'},250,function(){ 
       $(this).addClass('active'); 
      }); 

が、それは完全に機能しなくなりました！私は混乱しています、私は "begin to return"スクリプトが失敗したかどうかを理解することができましたが、少なくとも最初のサイクルはnext()と全く同じように動作するはずです。これは文字どおりnext()の値を返すためです。

<div id="parent> 
    <div class="common_class"></div> 
    <div class="common_class"></div> 
    <div class="common_class"></div> 
    <div class="common_class"></div> 
    <div class="undesired_elemement"></div> 
</div> 

Answer 1

は効果がありませんeachコールバックで戻り：

私のHTMLは次のようになります。あなたの回転子関数は、eachが返すものを返します。これはコールバックが返すものではありませんが、thisを再度返します。

ソリューション：eachを使用しないでください：あなたはセレクタが選択されたすべての要素に機能を適用する場合は

(function($){ 
    $.fn.extend.rotater = function(class_check){ 
     if(this.next().hasClass(class_check)){ 
      return this.next(); 
     else { 
      return this.parent().children().first(); 
     } 
    } 
})(jQuery); 

あなただけthis.eachを使用する必要があります。

複数の要素が選択されていても、奇妙な動作が発生することがあります。この場合、最初の要素を明示的に選択する必要があります。

var ele = this.eq(0);