圖片上傳預覽 ...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>圖片上傳預覽</title> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> </head> <body> <input type="file" id="preview_img"/> </body> <script> $(document).on("change","#preview_img",function(event){ /*添加預覽圖片節點*/ var node = "<img id='imgBox'>"; $(this).after(node); /*調用readAsDataURL介面，將圖片讀取為DataURL*/ var file = event.target.files[0]; var f = new FileReader(); f.readAsDataURL(file); /*讀取成功後顯示圖片*/ f.onload = function(e){ var src = e.target.result; $("#imgBox").attr("src",src); } }); </script> </html>
