JavaScript实现预览本地上传图片

<html>

    <head>
        <title>
            www.jb51.net图片上传预览
        </title>
        <script>
            function PreviewImage(imgFile) {
                var pattern = /(\.*.jpg$)|(\.*.png$)|(\.*.jpeg$)|(\.*.gif$)|(\.*.bmp$)/;
                if (!pattern.test(imgFile.value)) {
                    alert("系统仅支持jpg/jpeg/png/gif/bmp格式的照片！");
                    imgFile.focus()
                } else {
                    var path;
                    if (document.all) {
                        imgFile.select();
                        path = document.selection.createRange().text;
                        document.getElementById("imgPreview").innerHTML = "";
                        document.getElementById("imgPreview").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src=\"" + path + "\")"
                    } else {
                        path = URL.createObjectURL(imgFile.files[0]);
                        document.getElementById("imgPreview").innerHTML = "<img src='" + path + "'/>"
                    }
                }
            }
        </script>
    </head>

    <body>
        <div>
            <input type="file" onchange='PreviewImage(this)' />
            <div id="imgPreview" style='width: 500px; height: 400px;'>
                <img src="" />
            </div>
        </div>
    </body>

</html>