首頁猿問如何實(shí)現(xiàn)點(diǎn)擊div區(qū)域，即可上傳圖...

如何實(shí)現(xiàn)點(diǎn)擊div區(qū)域，即可上傳圖片，并在div中顯示圖片？

Html5 JavaScript 前端工具

Zoe_z 2016-09-22 15:22:29

查看完整描述

3 回答

已采納

OlderSkee

TA貢獻(xiàn)123條經(jīng)驗(yàn) 獲得超103個(gè)贊

對于input file?各個(gè)瀏覽器獲取的值不同。。

ie的老版本可以獲取完整路徑，現(xiàn)在很多瀏覽器從安全角度考慮，已經(jīng)不能獲取完整路徑了。。

沒有路徑自然就沒辦法顯示了。

結(jié)合后端才可以吧?。

2 反對回復(fù) 2016-09-22

我要開發(fā)地圖系統(tǒng)

TA貢獻(xiàn)29條經(jīng)驗(yàn) 獲得超13個(gè)贊

把div改成label，或直接在div的外面加一層label都行。

另外，你可以把input隱藏起來，用css——style="display: none;"。你可以給div設(shè)置任何喜歡的樣式了。

在div中顯示你上傳的圖片要用js來做，這個(gè)你可以到網(wǎng)上查查。

把div改成label

<label style="border: 5px solid #af0; overflow: hidden; position: relative; display: inline-block; width: 100px; height: 30px; background: #0fa;?border-radius: 70% 0;">
<input type="file" ?id="file" ?accept="image/*" style="display: none;"?/>
</label>

div的外面加一層label

<label>
????<div?style="border: 5px solid #af0; overflow: hidden; position: relative; display: inline-block; width: 100px; height: 30px; background: #0fa;?border-radius: 70% 0;">
????<input type="file" ?id="file" ?accept="image/*"?style="display: none;"?/>
????</div>
</label>

2 反對回復(fù) 2016-09-22