jquery - 同じクラス名を持つ同じページの複数の要素でjqueryスクリプトを機能させる

Question

簡略化された JSfiddle はこちら: http://jsfiddle.net/GGUq8/

liを取り、それらをdivに分割する小さなスクリプトがあります。スクリプトを 3 に設定すると、div ごとに最大 3 つliが含まれます。

正常に動作しますが、同じページの 2 つの要素に同じクラスを使用すると問題が発生します。これを行うと、分割がうまくいかず、同じ内容の 2 つの要素になってしまいます...

例については、 jsfiddleを確認してください。

Answer 1

これを活用できます.each()：

container.each(function( Index ) {

基本的に、コンテナを設定する$(containerClass)と、ページ上のすべての要素が検索され、両方で作業されます。そのため、関数を 1 回呼び出すと、最初に見つかった要素に対して機能しますが、ページ上のすべての要素がそのクラスで更新されます。次に、見つかった次のもので動作し、それらすべてを再度更新します。

を使用するeach()と、それらすべてを個別にループし、それぞれを個別に更新します。containerこれを実現するには、var を に設定して使用していたすべての場所を変更する必要があります$(this)。

スクリプトを更新しました。期待通りに動いていると思います。