Rumah > Artikel > hujung hadapan web > js上传图片预览
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $(".file").change(function(){ var fileImg = $(".fileImg"); var explorer = navigator.userAgent; var imgSrc = $(this)[0].value; if (explorer.indexOf('MSIE') >= 0) { if (!/\.(jpg|jpeg|png|JPG|PNG|JPEG)$/.test(imgSrc)) { imgSrc = ""; fileImg.attr("src","/img/default.png"); return false; }else{ fileImg.attr("src",imgSrc); } }else{ if (!/\.(jpg|jpeg|png|JPG|PNG|JPEG)$/.test(imgSrc)) { imgSrc = ""; fileImg.attr("src","/img/default.png"); return false; }else{ var file = $(this)[0].files[0]; var url = URL.createObjectURL(file); fileImg.attr("src",url); } } }) }) </script> </head> <body> <form enctype="multipart/form-date" method="post"> <input type="file"> <input type="submit"> </form> <img src="" alt="js上传图片预览" > </body> </html>