Javascript - 確定需要刪除或添加的元素數

我知道這個問題有一個簡單的解決方案，但我已經嘗試解決這個問題已經有一段時間了，需要您的幫助。Javascript - 確定需要刪除或添加的元素數

在我的代碼中，我根據屏幕寬度對我的文章DIV進行了重新排序，並將它們包裝成行並根據需要插入虛擬文章。

現在，假設我有一個包含4個文章DIV和1個dummy的jQuery集合。然後我需要知道我是否真的需要插入更多的傻瓜或刪除一些。每行正確的文章數量傳遞給相關函數。例如，假設每行需要2篇文章。

所以，在我運行代碼的佈局是這樣的：

| Article | Article | 
| Article | Article | 
| Dummy |

...當它需要是這樣的（冗餘假人移出）：

| Article | Article | 
| Article | Article |

這是我的當前代碼：

var checkForDummies  = function (unwrappedArticles, articlesPerRow) { 

     var $articles  = $(unwrappedArticles), 
      len    = $articles.length, 
      i, 
      dummiesFound = $articles.filter('.dummy-cell'), 
      dummiesNeeded = (len - dummiesFound.length) % articlesPerRow, 
      fragment  = document.createDocumentFragment(), 
      div    = document.createElement('div'); 

     // No dummies needed after removal  
     if  (dummiesNeeded === 0 && dummiesFound.length) 
      dummiesFound.remove(); 
     // No dummies needed nor found 
     else if (dummiesNeeded === 0) 
      return; 
     // Dummies needed – remove redundant dummies (max. dummies needed = dummiesNeeded) 
     else if (dummiesNeeded < dummiesFound.length) 
      dummiesFound.splice(dummiesNeeded); 
     // Dummies needed – create new ones 
     else if (dummiesNeeded > dummiesFound.length) 
      // Left out to preserve space 

    };

然而，這個代碼將不能在佈局看起來像這樣（每行5篇）工作 - 因爲dummiesNeeded是莫名其妙1而不是4：

| Article | Article | Article | Article | Article | 
| Article | Dummy |

任何幫助找到一個解決方案表示讚賞！謝謝！

更新的解決方案
有了明顯答案的幫助下，我需要修改dummiesNeeded並插入持有簽署需要假人的整數一個新的變量：

dummiesNeeded = (articlesPerRow - (len - dummiesFound.length) % articlesPerRow) % articlesPerRow, 
trueNeed  = dummiesNeeded - dummiesFound.length

來源

2013-02-19 micadelli

那麼，這個函數調用一次*每行* ？或者它應該被整個集合調用一次？ – 2013-02-19 15:01:30

@MattBurland它只被稱爲每組一次。 – micadelli 2013-02-19 15:09:06

[在固定大小頁面（多列）上佈局內容列表的算法的可能的重複]（http://stackoverflow.com/questions/8524699/algorithm-to-layout-a-table-of-contents -on-a-fixed-sized-page-multi-column） – starblue 2013-02-20 06:20:58

我覺得你的問題是在這裏：

dummiesNeeded = (len - dummiesFound.length) % articlesPerRow

如果，在你的榜樣，你有一個文章（所以LEN = 1）和一個假（所以dummiesFound.length = 1），則1-1 = 0，所以你dummiesNeeded結果是0 0％5 = 0而不是你想要的4。

當然你的dummiesNeeded應該是：

dummiesNeeded = (articlePerRow - (len - dummiesFound.length) % articlesPerRow) % articlesPerRow;

來源

2013-02-19 15:03:31

我覺得'len'實際上是這個函數中的文章總數。（在第二個例子中是7）。雖然感覺過於複雜，但公式'（articlesPerRow - （len％articlesPerRow）+ dummiesFound.length）％articlesPerRow'似乎可行。 – 2013-02-19 15:08:30

@ElliotNelson：是的，我得出了同樣的結論。目前還不清楚這是被稱爲每行還是整個集合（因此我的問題在上面）。不過，我不知道OP爲什麼會用'dummiesFound'困擾。它們是否已經包含在'len'中？一點都不清楚。 – 2013-02-19 15:10:36

@ElliotNelson這是正確的 - 'len'也包含虛擬元素。我可以先刪除所有的虛擬物，然後重新創建它們。但是這會使一些不必要的DOM操作 – micadelli 2013-02-19 15:12:40

的問題確實很 (len - dummiesFound.length) % articlesPerRow

，你必須使用articlesPerRow - ((len - dummiesFound.length) % articlesPerRow)

乾杯

來源

2013-02-19 15:16:49 shere

和Matt的回答一樣，當'len = 3'，'dummiesFound = 1'和'perRow = 2'時應該是'2'，當它應該是'-1（或0）'時， – micadelli 2013-02-19 15:35:36

Javascript - 確定需要刪除或添加的元素數

回答

相關問題