<script>
function show(f) {
var rd = new FileReader();//創(chuàng)建文件讀取對(duì)象
var files = f.files[0];//獲取file組件中的文件
rd.readAsDataURL(files);//文件讀取裝換為base64類型
rd.onloadend = function(e) {
//加載完畢之后獲取結(jié)果賦值給img
document.getElementById("book-pic").src = this.result;
}
$("#book-pic").css("display","inline-block").siblings(".imga").css("display","none");
}
</script>
關(guān)鍵點(diǎn):#book-pic; .imga
<div class="input-box">
<div class="label">行駛證照片</div>
<div class="input">
<label class="upload-input imga">
<input type="file" class="inputfile" accept="image/*" name="zheng" id="book-file" onchange="show(this)"/>
<div class="upload-btn">正本上傳</div>
</label><img id="book-pic2" src="/book/img/book-list/article/${book.image}.jpg" style="display:none;width:50px;height:50px;">
<label class="upload-input img">
<input type="file" class="inputfile" accept="image/*" name="fu" id="book-file3" onchange="show3(this)"/>
<div class="upload-btn">副本上傳</div>
</label><img id="book-pic3" src="/book/img/book-list/article/${book.image}.jpg" style="display:none;width:50px;height:50px;">
</div>
</div>
聯(lián)系客服