首页 > Web开发 > 详细

ajax上传预览

时间:2018-01-09 16:02:11      阅读:132      评论:0      收藏:0      [点我收藏+]

HTML

<input type="file" id="file" />

JS

var file1=document.getElementById("file");

file1.onchange=function(){
	var f = this.files[0];
	
	//格式化文件
	var fr = new FileReader();
	
	//图片
	if(f.type.indexOf(‘image‘)!=-1){
		alert(‘上传的是图片‘);
		//监控格式化是否完成
		fr.onload = function(){
			//创建一个image对象。
			var img = new Image();
			//监控图片是否加载完成。
			img.onload = function(){
				alert(‘图片加载完毕‘);
			};
			//给img地址。
			img.src = fr.result;
			//把img添加到页面。
			document.body.appendChild(img);
		};
		//添加需要格式化的文件。
		fr.readAsDataURL(f);
		return;
	}
	
	if(f.type.indexOf(‘text‘)!=-1){
		alert(‘上传的是文本‘);
		fr.onload = function(){
			console.log(fr.result);
		};

		//添加需要格式化的文本文件
		fr.readAsText(f,‘UTF-8‘);
		return;
	}
	console.log(f);
} 

 

ajax上传预览

原文:https://www.cnblogs.com/yangxue72/p/8251549.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!