手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >javascript结合fileReader 实现上传图片
javascript结合fileReader 实现上传图片
摘要:关于FileAPI这里就不详细解释了,小伙伴们自行度娘吧,来我们就要利用文件句柄来读取文件内容,这是通过FileReader来实现的,通过F...

关于File API这里就不详细解释了,小伙伴们自行度娘吧,来我们就要利用文件句柄来读取文件内容,这是通过FileReader来实现的,通过FileReader接口,我们可以异步地将文件内容加载到内存中,赋予某个js变量。

复制代码 代码如下:

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;

})();

}

}

以上就是javascript结合fileReader 实现上传图片的关键性代码了,小伙伴们喜欢吗?

【javascript结合fileReader 实现上传图片】相关文章:

javascript实现动态改变层大小的方法

Javascript实现的SHA-256加密算法完整实例

javascript用函数实现对象的方法

JavaScript实现带标题的图片轮播特效

javascript瀑布流布局实现方法详解

javascript实现淡蓝色的鼠标拖动选择框实例

javasript实现密码的隐藏与显示

JavaScript实现鼠标拖动效果的方法

javascript实现Table排序的方法

javascript实现table表格隔行变色的方法

精品推荐
分类导航