码迷,mamicode.com
首页 > Web开发 > 详细

ajax上传预览

时间:2018-01-09 16:48:27      阅读:156      评论:0      收藏:0      [点我收藏+]

标签:change   fun   文本   dex   files   ast   ons   indexof   bsp   

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上传预览

标签:change   fun   文本   dex   files   ast   ons   indexof   bsp   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!