同位素js過濾器問題

我在同位素js中應用過濾器時遇到問題。我的所有內容在應用過濾器時似乎都消失了。（注意：這個問題是關於在簡單的香草JS環境中使用Isotope而不是Jquery）。同位素js過濾器問題

我有一系列的DIV

<DIV id="thecontainer"> 
<DIV class="displaybox catnum1"> div content </DIV> 
<DIV class="displaybox catnum1"> div content </DIV> 
<DIV class="displaybox catnum2"> div content </DIV> 
<DIV class="displaybox catnum2"> div content </DIV> 
<DIV class="displaybox catnum3"> div content </DIV> 
</DIV>

，所以我有一個簡單的功能按類別進行過濾：

function ShowCat(catnumber) { 
    var container = document.getElementById('thecontainer'); 
      var iso = new Isotope(container); 
    iso.arrange(
     filter: '.catnum'+catnumber, 
     }); 
}

如果我打電話ShowCat（2），一切似乎都正常工作。只有'catnum2'類的兩個DIV纔可見。其他人消失了。到目前爲止好...

但是，如果我再打電話ShowCat（如：ShowCat（1）），而不是重濾波只顯示了「catnum1」 DIV的，所有的消失DIV的，我有一個黑屏。

我曾嘗試使用「*」作爲我的過濾器類型進行預過濾。我還嘗試了一個sortBy「原始順序」，然後再次使用新的過濾器請求執行該函數。但似乎沒有什麼能夠將DIV恢復到原來的觀點。該函數似乎只運行一次，並且所有後續調用似乎都將新的過濾器添加到第一個過濾器請求上，而不是從頭開始預先生成新的過濾器請求。

在運行新過濾器之前需要做些什麼嗎？任何線索爲什麼一切都消失了？

來源

2014-03-24 Bangkokian

問題已解決。

如果其他人有使用沒有Jquery的同位素的類似問題，我希望以下函數證明有用。沒有框架（除了同位素）是必要的。

（這將隱藏和顯示問題中定義的DIV）。

使用以下命令調用該函數：cats.showCat（1）;

用空參數重置爲原始（未過濾視圖）：cats.showCat（）;

var Cats = (function(){ 

function Cats(element) { 
    this.element = element; 

    this.iso = null; 

    this.currentCat = null; 


    this.init(); 
}; 

Cats.prototype.init = function() { 
    this.iso = new Isotope(this.element); 
}; 

Cats.prototype.showCat = function(catNumber) { 
    if(this.currentCat == catNumber){ 
     return; 
    }; 

    this.currentCat = catNumber; 

    if(catNumber == null){ 
     this.iso.arrange({ 
      filter: '*' 
     }); 
    }else{ 
     this.iso.arrange({ 
      filter: '.catnum' + catNumber 
     }); 
    }; 

}; 


return Cats; 
})(); 


var cats = new Cats(document.getElementById('thecontainer'));

來源

2014-03-25 12:00:08 Bangkokian

同位素js過濾器問題

回答

相關問題