js 图片上传并预览
来源:互联网 发布:魏建峰 知乎 编辑:程序博客网 时间:2024/05/16 10:20
对于 Chrome、Firefox、IE10 使用 FileReader 来实现。
对于 IE6~9 使用滤镜 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 来实现。<!DOCTYPE html>
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><style type="text/css">#preview,.img,img {width: 200px;height: 200px;}#preview {border: 1px solid #000;}</style></head><body><div id="preview"></div><input type="file" onchange="preview(this)" /><script type="text/javascript">function preview(file) {var prevDiv = document.getElementById('preview');if (file.files && file.files[0]) {var reader = new FileReader();reader.onload = function(evt) {prevDiv.innerHTML = '<img src="' + evt.target.result + '" />';}reader.readAsDataURL(file.files[0]);} else {prevDiv.innerHTML = '<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';}}</script></body></html>
0 0
- js上传图片,并预览
- js上传图片,并预览
- js 图片上传并预览
- js 选择预览图片,并上传
- 原声js 图片上传并预览
- 上传图片并预览-原生js代码
- js实现上传图片并预览
- 图片上传并预览
- 上传图片并预览
- 图片上传并预览
- 图片上传并预览
- 图片上传并预览
- js上传并预览
- JS预览上传图片
- js图片上传预览
- js 图片上传预览
- js上传图片预览 .
- JS预览上传图片
- Toolbar中Menu不显示
- iOS9 HTTP 不能正常使用的解决办法
- 解决webpack打包慢的解决办法汇总
- python环境搭建
- 使用jxl读取excel报错记录:jxl.read.biff.BiffException: Unable to recognize OLE stream
- js 图片上传并预览
- 全面NodeJs学习教程
- Extra属性
- mac系统ionic开发ios app从安装到打包
- yaf 安装和开发环境配置
- WebDriver切换浏览器窗口
- 使用消息和消息队列(译自MSDN)
- C++ 怎么自己创建头文件
- Jenkins 邮件配置 (使用 Jenkins Email Extension Plugin)