怎么通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端?
今天在论坛上看到这样一个问题,有必要编辑搜集下。
问题描述:怎么通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端
题主用jquery接收
<input name="c_pic" id="c_pic" type="file" class="file">
用的方法是:
var input = document.getElementById("c_pic");
input.addEventListener('change',readFile,false);
function readFile(){
var file = this.files[0];
}
题主想用ajax 的post方法把上传图片的相关信息传给后端,
接收到的file是个object file,
请问怎么转换成能够用post传递的数据格式?
当时我看到这个题目就想这还不简单,直接把file通过JSON.stringify(file)(注:stringify()用于从一个对象解析出字符串),代码如下:
var input = document.getElementById("c_pic");
input.addEventListener('change',readFile,false);
function readFile(){
var file = this.files[0];
var file_json = JSON.stringify(file);
console.log(file_json); //打印出来是: {}
$.post('',file_json);
}
发现打印出来的是一个空的对象:{};有知道的麻烦告知,感激不尽!
于是换了一种思路用uploadfile插件或百度的webuploader,其中jQuery File Upload 是一个Jquery图片上传组件,支持多文件上传、取消、删除,上传前缩略图预览、列表显示图片大小,支持上传进度条显示;支持各种动态语言开发的服务器端。
如果支持html5,可以使用FormData Ajax上传也能实现的。
怎么通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端?的更多相关文章
- js 获取上传视频的时长、大小、后缀名
参考资料:获取时长 var fileName = $("#sectionfileUpload").val(); //C:\fakepath\3.jpeg var exts = fi ...
- js获取上传文件内容(未完待续)
js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...
- Atitit.js获取上传文件全路径
Atitit.js获取上传文件全路径 1. 默认的value只能获取文件名..安全原因.. 1 2. Firefox浏览器的读取 1 3. Html5 的file api 2 4. 解决方法::使用a ...
- js获取上传文件内容
js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...
- JS获取上传文件的绝对路径,兼容IE和FF
<input type="file" id="fileBrowser" name="fileBrowser" size="5 ...
- js获取上传文件的绝对路径
在html中 <input type="file" id="importFile" /> <input type="bu ...
- js 获取上传文件的字节数及内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js获取上传的文件并用ajax提交
<form id="form1" name="form1" encType="multipart/form-data" method= ...
- JS获取上传文件的名称、格式、大小
<input id="File1" type="file" onchange="checkFile(this)" /> 方式一) ...
随机推荐
- java File.mkdirs和mkdir区别
File f = new File("e://xxx//yyy"); System.out.println(f.mkdirs());//生成所有目录,一般来说,这个方法稳健性更好, ...
- Eclipse环境下使用Maven注意事项
在最新版本的Eclipse Java EE IDE for Web Developers中已经包含Maven 2 在File,New中可以看到Maven Project,新建, 按照步骤一路下来,要求 ...
- 微信公共平台开发5 .net
每次在于微信交互时,都要用到access_token,但是这个值限制的是有时间的,但是access_token,在以后的高级功能里面会经常用到,所以这里不得不这里对前面所讲解的access_token ...
- sqlserver允许远程连接的配置
如果无法通过IP地址远程连接你服务器上的SQL Server服务器,可以参考下面的内容进行设置 在进行下述设置之前,应该确保你的网络已经安装设置完毕,服务器已经正常连接到网络中. 1.单击Window ...
- Bit-Coin收入的一分钱
好吧,这是我在Slush's pool上对Bit-coin收入的第一分钱. 回想起来,2013年平安夜开始到今天,将近3个月没日没夜窝在这个矿里挖矿 从最开始的集成显卡挖,买了显卡挖,加了显卡挖,使用 ...
- 【转】Android Studio中通过快捷键来提取提取方法
今天来给大家介绍一个非常有用的Studio Tips,有些时候我们在一个方法内部写了过多的代码,然后想要把一些代码提取出来再放在一个单独的方法里,通常我们的做法是复制粘贴,现在我来教给大家一个非常简洁 ...
- 二维数组 string[,]
string[,] strArr = { {"101","电脑"}, ...
- IOS字典NSDictionary与NSMutableDictionary知识点
字典中的元素是以键值对的形式存储的,键值对的键和值,都是任意的对象,但是键往往使用字符串,字典存储对象的地址没有顺序,字典的遍历分为:键的遍历和值的遍历,字典与数组的区别:数组讲究顺序,而字典可以快速 ...
- IOS开发-表单控件的应用
1. 需求描述 2. 开发环境介绍 3. 创建一个工程 4. 工程配置介绍 5. 目录结构介绍 6. 界面设置 7. 关联输入输出 8. 关联事件代码 9. 运行结果 10. UITextField ...
- GCD中的dispatch_apply的用法及作用
GCD中的dispatch_apply的用法及作用 (一)dispatch_apply的基本用法 dispatch_apply函数是dispatch_sync函数和Dispatch Group的关联A ...