如何在滾動時動態加載圖像而不重複？

我已經通過多個論壇和教程解釋如何動態加載數據。如何在滾動時動態加載圖像而不重複？

我完全理解我需要通過php文件對數據庫進行AJAX調用以獲取數據異步。

使用select語句和例如的順序，圖像以隨機順序以12的極限加載。 SELECT * FROM images ORDER BY rand() LIMIT 12

我希望在用戶滾動到頁面底部時加載更多圖像。

問題是如何確保圖像不被加載兩次。我曾經想過要獲取一組加載的圖像，並通過AJAX調用傳遞它，然後執行適當的SQL語句，然後從圖像數組中選擇另外3個圖像「DISTINCT」，並加入所有圖像。

但我不確定如何比較數組與SQL表。或者，如果這是解決問題的最佳方法。

總結：

圖片表：1，2，3，4，5，6，7，8，9，10，11，12，13，14，15，16

加載在HTML中的圖像：1,3,4,5,6

當滾動到頁面底部時，加載3個與HTML中加載的圖像截然不同的隨機圖像。

邊注：我更喜歡使用純JavaScript而不是導入插件。

編輯：我有邏輯下來，它更多的是它的應用程序，我與之奮鬥。我應該提到我想使用散列片段，這樣我就可以讓谷歌索引html快照，這將有效地加載所有圖像。

使用lazyload .... google一下 – Daya

嘗試http://dinbror.dk/blazy/ –

我不希望導入插件！讓我重新表達...我想比較一個數組與sql語句。我想我必須得到所有圖像的表格，在已經加載到HTML中的圖像上使用某種聯合，然後從新的結果集中隨機選擇3張圖像。但是我不再熟悉SQL，無法知道要使用的確切操作。 – user3012749

嘗試在某個地方（會話，cookie，javascript）保存加載的圖像，然後在條件中使用已加載圖像的數組將它們從查詢結果中排除。

SELECT * FROM images WHERE id_image NOT IN (1, 3, 4, 5, 6) ORDER BY rand() LIMIT 12

2014-05-19 14:06:41 nicowernli

是的，這是我正在尋找的東西。我可以將這些數字作爲數組傳遞嗎？我會通過javascript循環來檢查圖像的src，將它們存儲在數組中以傳遞給php文件。然後php文件應該像你所建議的那樣使用sql語句。 – user3012749

回答