<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div class="upload_box"> <b>上傳圖片</b> <input type="file" name="file" id="file" accept="image/*" onchange="imgChange(this);"/> <!--文件上傳選擇按鈕--> <div id="preview"> <img id="imghead" src=""/> <!--圖片顯示位置--> </div> </div> </body> </html> <script type="text/javascript"> // 選擇圖片顯示 function imgChange(obj) { //獲取點擊的文本框 var file = document.getElementById("file"); var imgUrl = window.URL.createObjectURL(file.files[0]); var img = document.getElementById('imghead'); img.setAttribute('src', imgUrl); // 修改img標簽src屬性值 }; </script>