0

クラスを見つけて他のすべてを非表示にすることで、div クラスを使用するフィルター関数があります。動的に div を追加する関数もありますが、フィルター関数では正しく動作しません。動的に追加された div は、インデックス番号を使用して各行の末尾に追加されます。

問題は、非表示の div が元のインデックス番号を保持していることです。それらをすべて切り離して(divの内容を保持して)、選択したdivの後に追加したいと思います。

Example before filtering (A0 = filter/index):
A0  B1  A2
<Dynamic Div after Row 1>
A3  B4  B5

This is what happens now when I filter:
B1  B4  B5
A0  A2  A3
<Dynamic Div after Row 1 - because A2 is the end of row 1 according to the index>

This is what I need to happen:
B0  B1  B2
<Dynamic Div after Row 1 - index numbers were changed>
A3  A4  A5

これは私のフィルタリング機能です:

$('nav a').click(function(){
    var content = '.content';
    var portfolio = '#portfolio > a';
    var getClass = $(this).attr('class'); //get the filter via class

    //hides any active content windows
    if($(content).length) { $(content).slideUp(300, function(){ $(this).remove(); }); }

    if(getClass){
        $('.tags').not("." + getClass).slideUp(300, function() {     //hide all tags except selected tag
            $("." + getClass).slideDown(300);   //show selected tag if already hidden
            $(portfolio).children($('.tags').not("." + getClass).parent()).detach();
        });
    } else {
        $('.tags').slideDown(300); //show all
    }

});

これは私が正しくない行です:

$(portfolio).children($('.tags').not("." + getClass).parent()).detach();

ナビゲーション要素を削除しないようにポートフォリオ内の .tags を選択する必要がありますが、その div のアンカー リンク (親要素) を選択する必要があります。

Stackoverflow では要素の画像を投稿できず、html コードを正しく表示できませんが、基本的に要素は次のようになります。 a href="content.php" div class="tags branding" style="background:url(images/BacktoSchool-header.jpg)" div class="text" Content Name

4

1 に答える 1

0

name 属性がクラス値を保持するようにナビゲーションの行を変更して'.tags'、ナビゲーション要素を削除したり、ポートフォリオの子クラス、次にクラスの親をターゲットにしたりする必要なく、すべてを非表示にできるようにしました。

作業コードの変更は次のとおりです。

var getClass = $(this).attr('name'); //get the filter via name

if(getClass){
    $('.tags').not("." + getClass).slideUp(300, function() {     //hide all tags except selected tag
        $("." + getClass).slideDown(300);   //show selected tag if already hidden
            $holder = $('.tags').not("." + getClass).parent().detach();  //detaches all the other tags
            $holder.insertAfter($(portfolio + ':last'))  //appends them
        });
    } else {
        $('.tags').slideDown(300); //show all
    }
于 2013-04-26T04:08:21.007 に答える