function getImgSrc(target, callback) {
if (window.FileReader) {
var oPreviewImg = null, oFReader = new window.FileReader();
oFReader.onload = function (oFREvent) {
oPreviewImg = new Image();
var type = target.files[0].type.split("/")[1];
var src = oFREvent.target.result;
oPreviewImg.src = src; if (typeof callback == "function") {
callback(oPreviewImg, target, type, src);
} return oPreviewImg.src;
}; return (function () {
var aFiles = target.files;
if (aFiles.length === 0) {
return;
}
if (!IsImgType(aFiles[0].type)) {
alert("You must select a valid image file!");
return;
} if (aFiles[0].size > 1024 * 1024) {
target.value = "";
alert('Please upload image file size less than 1M.');
return;
} oFReader.readAsDataURL(aFiles[0]);
})();
}
if (navigator.appName === "Microsoft Internet Explorer") {
return (function () {
document.getElementById("imagePreview").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = target.value;
})();
}
}

fileReader 上传图片的更多相关文章

  1. html5使用FileReader上传图片

    客户端代码是网上找的,修改为.net代码. <html><head>    <meta charset="utf-8">    <titl ...

  2. FileReader上传图片

    实现拖拽图片,在上传至服务器前,显示图片并操控大小 利用HTML5 dragenter dragover dragleave drop 在实现图片显示方面,用了FileReader这个类 var fi ...

  3. New FileReader上传图片

    function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader() ...

  4. 上传图片获取base64编码、本地预览

    一.读取文件的对象 — new FileReader()   上传图片接口参数有图片base64编码(数组, imgBase64List ),主要用到 读取文件的对象 [ new FileReader ...

  5. 利用FileReader实现上传图片前本地预览

    引子 平时做图片上传预览时如果没有特殊的要求就直接先把图片传到后台去,成功之后拿到URL再渲染到页面上,这样做在图片比较小的时候没什么问题,大一点的话就会比较慢才能看到预览了,而且还产生了垃圾文件,所 ...

  6. JavaScript 中的FileReader对象(实现上传图片预览)

    方法一:使用js的FileReader对象 1.FileReader对象简介 1.检测浏览器对FileReader的支持 if(window.FileReader) { var fr = new Fi ...

  7. js上传图片&预览(filereader)

    fileReader HTML5定义了FileReader作为文件API的重要成员用于读取文件,根据W3C的定义,FileReader接口提供了读取文件的方法和包含读取结果的事件模型. FileRea ...

  8. JS上传图片-通过FileReader获取图片的base64

    下面文章,我想要的是: FileReader这个对象,可以借助FileReader来获取上传图片的base64,就可以在客户端显示该图片了.同时,还可以把该图片的base64发送到服务端,保存起来. ...

  9. 通过HTML5 FileReader实现上传图片预览功能

    原文:http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/201706224590.html 在上传图片到服务器之前,我们希望可以预览一下要上传的图片. ...

随机推荐

  1. Nginx HTTP Server相关

    一.Nginx安装: 采取手动编译安装 对多种重要的选项进行配置 安装前提:常用工具和库,GCC PCRE(Rewrite模块需要) pcre-devel(源码) zlib zlib-devel(源码 ...

  2. 【Lintcode】118.Distinct Subsequences

    题目: Given a string S and a string T, count the number of distinct subsequences of T in S. A subseque ...

  3. 【Lintcode】036.Reverse Linked List II

    题目: Reverse a linked list from position m to n. Given m, n satisfy the following condition: 1 ≤ m ≤ ...

  4. BZOJ1568:[JSOI2008]Blue Mary开公司

    浅谈标记永久化:https://www.cnblogs.com/AKMer/p/10137227.html 题目传送门:https://www.lydsy.com/JudgeOnline/proble ...

  5. rt-thread的定时器管理源码分析

    1 前言 rt-thread可以采用软件定时器或硬件定时器来实现定时器管理的,所谓软件定时器是指由操作系统提供的一类系统接口,它构建在硬件定时器基础之上,使系统能够提供不受数目限制的定时器服务.而硬件 ...

  6. qpython 读入数据问题: EOF error with input / raw_input

    直接使用input会报错 EOF error with input / raw_input 原因是在qpy里console mode 命令行模式不是完全和pc上的命令行一致,所以input和raw_i ...

  7. Java线程安全与多线程开发

    互联网上充斥着对Java多线程编程的介绍,每篇文章都从不同的角度介绍并总结了该领域的内容.但大部分文章都没有说明多线程的实现本质,没能让开发者真正“过瘾”. 从Java的线程安全鼻祖内置锁介绍开始,让 ...

  8. C#阵列Array排序

    五一假期回来,练习一下C#的一些知识,了解一下排序. 练习数据: , , , , , , , , }; 写一个类: using System; using System.Collections.Gen ...

  9. 原生js实现一个侧滑删除取消组件(item slide)

    组件,本质上是解决某个问题封装的类,在此记录原生js实现侧滑删除 先上效果图 实现思路 1. 确定渲染的数据结构 2. 思考划分布局,总的有两个主要的模块:内容区域和按钮区域 2.1 内容区域保持宽度 ...

  10. 痞子衡嵌入式:微处理器CPU性能测试基准(Dhrystone)

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是微处理器CPU性能测试基准Dhrystone. 在嵌入式系统行业用于评价CPU性能指标的标准主要有三种:Dhrystone.MIPS.C ...