下載從ajax調用的圖像時，瀏覽器如何操作？

我是這個主題的新人，所以我對此問題表示歉意:) 我需要創建一個頁面，該頁面必須顯示一個帖子中上傳的所有圖片。當用戶點擊下一個按鈕時，它必須加載下一張圖片，替換第一張圖片。下載從ajax調用的圖像時，瀏覽器如何操作？

< [ image1 ] > 
    Title 
    Description 
    other content

- >用戶點擊下一個

< [ image2 ] > 
    Title 
    Description 
    other content

然而，爲了加快圖像顯示負荷，以下兩個圖像需要在隱藏面板要被下載，因此圖像將被緩存時用戶點擊下一步並加載下一批圖像。

如果我使用ajax來完成這項任務，瀏覽器會使用下載的圖片還是ajax會再次下載它們？

有沒有辦法讓這個過程更優化？

非常感謝！

來源

2013-03-16 Arturo Suarez

我認爲你有正確的想法。當用戶點擊下一個時，只需讓瀏覽器使用javascript顯示隱藏面板併發出ajax調用以檢索以下圖像並將其添加到隱藏面板。這個SO問題可能有助於[鏈接]（http://stackoverflow.com/questions/7074685/how-to-add-image-to-show-hide-div-javascript） – ssn771 2013-03-16 22:42:55

您可以使用ajax將下一張圖片的數據下載到字符串，並將其轉換爲base64字符串，並通過將圖片的src屬性更改爲「數據」將其嵌入到html中（當單擊下一個按鈕時，使用javascript）：圖像/ PNG; BASE64，（base64stringhere）」與圖像的所下載的base64串置換（base64stringhere）

REF：http://www.techerator.com/2011/12/how-to-embed-images-directly-into-your-html/

REF：How can you encode a string to Base64 in JavaScript?

注意：大多數瀏覽器高速緩存的圖像，所以它如果用戶正在查看圖像，會浪費相當多的帶寬已經下載了。

來源

2013-03-16 22:42:09

這種方式下載圖像比使用Ajax ？ – 2013-03-16 22:52:28

這使用ajax來下載它們，它只是在後臺下載下一個圖像，並在用戶點擊下一個按鈕 – 2013-03-16 22:58:45

後立即更改它們，但如果我創建了一個Ajax函數來下載圖像，瀏覽器如果圖像在緩存中，忽略下載功能？ – 2013-03-16 23:14:21