微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

js上传图片预览

下面是编程之家 jb51.cc 通过网络收集整理的代码片段。

编程之家小编现在分享给大家,也给大家做个参考。

    <!DOCTYPE html>  
    <html lang="en">  
    <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" class="file">  
            <input type="submit" class="sub">  
        </form>  
        <img src="" class="fileImg">  
    </body>  
    </html>  

以上是编程之家(jb51.cc)为你收集整理的全部代码内容,希望文章能够帮你解决所遇到的程序开发问题。

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐