(js)上传图片预览

来源：互联网发布：虚拟变量数据什么意思编辑：程序博客网时间：2024/06/14 08:17

    <div class="jzyr_dtphto">                            <div id="preview">                                <img id="HeadImage"   src="../Images/DesignImg/ptoimg.png" class="jzyr_dtphtoimg" runat="server" />                            </div>                            <div class="jzyr_qjdupiptdiv_deta">                                <img id="Im" src="../Images/DesignImg/upload.png" runat="server" class="jzyr_qjdfjimg_deta" />                                <%-- <input type="file" id="ImageHead"/>--%>                                <asp:FileUpload ID="UploadImage" onchange="Show(this)" Style="width: 100%; height: 100%;                                    position: absolute; left: 0; top: 0; filter: alpha(opacity:0); opacity: 0;" runat="server" />                                <p class="jzyr_qjdupp_deta">                                    浏览</p>                            </div>                        </div>

  function Show(file) {            var div = document.getElementById('preview');            if (file.files && file.files[0]) {                div.innerHTML = '<img id=imghead>';                var img = document.getElementById('imghead');                img.width = "100";                img.height = "100";                var reader = new FileReader();                reader.onload = function (evt) { img.src = evt.target.result; }                reader.readAsDataURL(file.files[0]);            } else {                var sFilter = 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';                file.select();                var src = document.selection.createRange().text;                div.innerHTML = '<img id=imghead>';                var img = document.getElementById('imghead');                img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;                div.innerHTML = "<div id=divhead style='width:160px;height:180px;" + sFilter + src + "\"'></div>";            }        }

0 0