鍍金池/ 問答/HTML5  HTML/ html、javascript如何每次觸發(fā)file上傳事件,把圖片排列顯示,點(diǎn)擊

html、javascript如何每次觸發(fā)file上傳事件,把圖片排列顯示,點(diǎn)擊一次上傳,向右顯示一次選擇的圖片?

如何每次點(diǎn)擊按鈕上傳一張圖片,把圖片排列顯示,點(diǎn)擊一次上傳,向右顯示這次選擇的圖片?我現(xiàn)在點(diǎn)擊一次之后會(huì)在原位置覆蓋上次的圖片,不想覆蓋。
html:
clipboard.png
js:

clipboard.png

clipboard.png

回答
編輯回答
懶洋洋

在這個(gè)方法里,你一直調(diào)用的是頁面中的 #image 里面的 img 標(biāo)簽, 每次上傳成功都是把img Src 替換掉了,想達(dá)到需要的效果只需重新創(chuàng)建 img 標(biāo)簽 append到 #image中就行了

clipboard.png

把第一個(gè)刪除掉。在change事件里創(chuàng)建新的 img標(biāo)簽,然后在onload中賦值新創(chuàng)建的img標(biāo)簽的src ;
(可能會(huì)出現(xiàn)的問題: 上傳失敗依然創(chuàng)建了一個(gè)空的img 標(biāo)簽,這里你做下處理就好了)

2017年4月15日 12:25