公司电脑限制太多，做个备忘录。上传预览图片ie滤镜图片宽高不受控制的问题

根据网上前辈们的代码整合的

html代码：

<tr id="seal">

                    <td colspan="4">

                        <div id="imgPreview">

                            <img id="cn_songhuo" src="../Image/SupImg/upimg.gif" alt="送货印章"/>

                            <input name="uploadify" id="file1" value="" class="file"

                                accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" multiple="" type="file" onchange="cn_shchange()"/>

                            <label>送货印章</label>

                        </div>

                    </td>

                    <td colspan="3">

                        <div>

                            <img id="cn_caiwu" src="../Image/SupImg/upimg.gif" alt="财务印章"/>

                            <input name="FinancialSeal_CN" id="file2" class="file" value=""

                                accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" multiple="" type="file" onchange="cn_cwchange()" />

                            <label>财务印章</label>

                        </div>

                    </td>

                    <td colspan="4">

                        <div>

                            <img id="songhuo" src="../Image/SupImg/upimg.gif" alt="送货印章"/>

                            <input name="DeliverySeal" id="file3" class="file" value=""

                                accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" multiple="" type="file" onchange="shchange()" />

                            <label>送货印章</label>

                        </div>

                    </td>

                    <td>

                        <div>

                            <img id="caiwu" src="../Image/SupImg/upimg.gif" alt="财务印章"/>

                            <input name="FinancialSeal" id="file4" class="file" value=""

                                accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" multiple="" type="file" onchange="cwchange()"/>

                            <label>财务印章</label>

                        </div>

                    </td>

                </tr>

css样式：

#seal td div{

     width:290px; height:200px;

     text-align:center;

     vertical-align:middle;

     position: relative; /* 保证子元素的定位 */

     width: 100%;

     height: 100%;

     cursor: pointer;

 }

#seal td div label

{

    position:absolute;bottom:0;right:0;

    color:#999999;

}

#seal td div img{

     width:190px;

     height:180px;

 }

.file {

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    width: 100%; /* 宽高和外围元素保持一致 */

    height: 100%;

    opacity: 0;

    -moz-opacity: 0; /*兼容老式浏览器 */

    filter: alpha(opacity=0); /* 兼容ie */

}

js：

<script type="text/javascript">

    $(document).ready(function () {

        

    })

    function cn_shchange()

    {

        var pic = document.getElementById("cn_songhuo"),

           file = document.getElementById("file1");

        preview(pic, file);

    }

    function cn_cwchange()

    {

        var pic = document.getElementById("cn_caiwu");

            file = document.getElementById("file2");

        preview(pic,file);

    }

    function shchange()

    {

        var pic = document.getElementById("songhuo");

            file = document.getElementById("file3");

        preview(pic, file);

    }

    function cwchange()

    {

        var pic = document.getElementById("caiwu");

            file = document.getElementById("file4");

        preview(pic, file);

    }

    function preview(pic, file) {

        var ext = file.value.substring(file.value.lastIndexOf(".") + 1).toLowerCase();

        // gif在IE浏览器暂时无法显示

        if (ext != 'png' && ext != 'jpg' && ext != 'jpeg'&&ext!='gif'&&ext!='bmp') {

            alert("上传的文件必须为常见图片格式！");

            return;

        }

        var isIE = navigator.userAgent.match(/MSIE/) != null,

            isIE6 = navigator.userAgent.match(/MSIE 6.0/) != null;

        if (isIE) {

            file.select();

            var reallocalpath = document.selection.createRange().text;

            // IE6浏览器设置img的src为本地路径可以直接显示图片

            if (isIE6) {

                pic.src = reallocalpath;

                pic.style.width = '190px'

                pic.style.height='180px'

            } else {

                pic.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";

                pic.filters("DXImageTransform.Microsoft.AlphaImageLoader").src = reallocalpath;

                pic.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==';

            }

        } else {

            html5Reader(file,pic);

        }

    }

    function html5Reader(file,pic) {

        var file = file.files[0];

        var reader = new FileReader();

        reader.readAsDataURL(file);

        reader.onload = function (e) {

            //var pic = document.getElementById("cn_songhuo");

            pic.src = this.result;

            pic.style.width = '180px';

            pic.style.height = '190px';

        }

    }

</script>