1

<li>要素のリストがあり:nth-child、3 番目と 4 番目の要素ごとに特定の子をターゲットにして、それらに追加の class を与えるために使用してい.rightます。

しかし、一部の要素 (たとえば、最初または 2 番目のリスト項目) を非表示にすると、正しく機能しません。表示されているリスト項目の子にのみクラス "right" を追加したい。どうやってやるの？

これは私が使用しているコードです:

$(".ilist:visible:nth-child(4n+3)").find(".window").addClass("right");
$(".ilist:visible:nth-child(4n+4)").find(".window").addClass("right");

そして、これですべてのクラスを削除します.right：

$(".ilist .window.right").removeClass("right");

HTML 構造:

<ul>
   <li class="ilist">
      ...
      <div class="name">Name (Search works with it)</div>
      <div class="window"></div>
   </li>

   ...
</ul>
4

2 に答える 2

2

n 番目ごとの表示リスト項目の子にクラスを追加するには、最初にすべての表示リスト項目を見つけてから、コレクション内のランクでそれらをフィルター処理します。

$(".ilist:visible").filter(function(index){
    return (index % 4 == 0) || (index % 4 == 3);
}).find(".window").addClass("right");
于 2013-02-03T00:10:32.317 に答える
1

要素を非表示にしても、DOMツリー内での位置は変更されnth-child(4n+3)ないため、兄弟リスト項目を非表示にしても変更されません。

一部の要素リストアイテムの表示を切り替える場合は、rightクラスをリセットして、適切な要素に再適用する必要があります。

addClassこれを行うには、新しいクラス名の代わりに関数をに渡します。この関数は、一致した要素のインデックスを最初のパラメーターとして受け取り、それが3番目か4番目かを確認するために使用できます。そうである場合は、適用する新しいクラス名を返します。

$(".ilist .window.right").removeClass("right");
$(".ilist:visible .window").addClass(function(i, currentClass){
    return (i == 2 || i == 3) ? "right" : "";
});

http://jsfiddle.net/6TMmJ/でのライブデモ

于 2013-02-02T23:58:19.050 に答える