分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

IE浏览器上传图片预览兼容(IE 7 8 9 10 11)

发布时间:2023-09-06 01:27责任编辑:白小东关键词:浏览器上传图片
 $("#file_upload").change(function () { ???????????????var $file = $(this); ???????????????var fileObj = $file[0]; ???????????????var windowURL = window.URL || window.webkitURL; ???????????????var dataURL; ???????????????var $img = $("#preview"); ???????????????if (fileObj && fileObj.files && fileObj.files[0]) { ???????????????????dataURL = windowURL.createObjectURL(fileObj.files[0]); ???????????????????$img.attr(‘src‘, dataURL); ???????????????} else { ???????????????????dataURL = $file.val(); ???????????????????// $img.css("filter",‘progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale,src="‘ + dataURL + ‘")‘); ???????????????????// var imgObj = document.getElementById("preview"); ???????????????????// imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\"" + dataURL + "\")"; ???????????????????// imgObj.style.width = "48px"; ???????????????????// imgObj.style.height = "48px"; ???????????????????var imgObj = document.getElementById("preview"); ???????????????????// 两个坑: ???????????????????// 1、在设置filter属性时,元素必须已经存在在DOM树中,动态创建的Node,也需要在设置属性前加入到DOM中,先设置属性在加入,无效; ???????????????????// 2、src属性需要像下面的方式添加,上面的两种方式添加,无效; ???????????????????imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)"; ???????????????????imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL; ???????????????} ???????????});


前端代码:

    <input id="file_upload" type="file" />
???????    <div class="image_container" id="previewDIV">
???????????      <img id="preview" width="200" height="200" alt="没有图片">
???????    </div>

 

IE浏览器上传图片预览兼容(IE 7 8 9 10 11)

原文地址:http://www.cnblogs.com/jicheng/p/7910924.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved