【2】通过Ajax方式上传文件(图片),使用FormData进行Ajax请求
HTML:
<form id= "uploadForm">
<p >指定文件名: <input type="text" name="filename" value= ""/></p >
<p >上传文件: <input type="file" name="file"/></ p>
<input type="button" value="上传" onclick="doUpload()" />
</form>
JS:
function doUpload() {
var formData = new FormData($( "#uploadForm" )[0]);
$.ajax({
url: 'xxx' , --------------这里是请求的接口
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (returndata) {
alert(returndata);
},
error: function (returndata) {
alert(returndata);
}
});
}
【2】通过Ajax方式上传文件(图片),使用FormData进行Ajax请求的更多相关文章
- koa2:通过Ajax方式上传文件,使用FormData进行Ajax请求
koa2通过表单上传的网上很多,但通过Ajax方式上传文件,使用FormData进行Ajax请求,不好找. 参考了这个用base64上传图片的例子.https://github.com/Yuki-Mi ...
- 通过Ajax方式上传文件,使用FormData进行Ajax请求
通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...
- [转] 通过Ajax方式上传文件,使用FormData进行Ajax请求
通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...
- Ajax方式上传文件
用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 For ...
- 上传文件,使用FormData进行Ajax请求,jsoncallback跨域
通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...
- 通过Ajax方式上传文件(input file),使用FormData进行Ajax请求
<script type="text/jscript"> $(function () { $("#btn_uploadimg").click(fun ...
- Ajax方式上传文件报错"Uncaught TypeError: Illegal invocation"
今天使用ajax上传文件时,出现了错误.数据传输的方式是通过定义formData完成的,提交的文件对象也设置为dom对象,但是还是不能发送请求.F12看到后台报了个错误:Uncaught TypeEr ...
- jQuery Ajax方式上传文件实现暂停或取消上传
未上传时要实现取消,很简单... 但如果用户点击了上传,并加载了进度信息... 2017-05-04再次改进.在上传过程中用户可以按 Esc 来取消上传(取消当前上传,或者是全部上传)... 也可以在 ...
- ajax如何上传文件(整理)
ajax如何上传文件(整理) 一.总结 一句话总结:用FormData,FormData+ajax=异步上传二进制文件 <form enctype="multipart/form-da ...
随机推荐
- 可以提升幸福感的js小技巧(下)
4.数字 4.1 不同进制表示法 ES6中新增了不同进制的书写格式,在后台传参的时候要注意这一点. 29 // 10进制 035 // 8进制29 原来的方式 0o35 // 8进制29 ES6的方式 ...
- 安装wordpress的过程
1 首先安装lamp.在安装php时,由于ubuntu16.04源中自带的是php7,所以需要直接安装 apt-get install phpapt-get install libapache2-mo ...
- 模拟赛小结:2014-2015 ACM-ICPC, NEERC, Southern Subregional Contest
2014-2015 ACM-ICPC, NEERC, Southern Subregional Contest 2019年10月11日 15:30-20:30(Solved 6,Penalty 740 ...
- Fiddler抓包的简单使用
Fiddler抓包的简单使用 参考的博客文章:玲虫师的<Fiddler抓包[5]_Fiddler过滤>. (1)使用fiddler进行过滤,只抓取需要的网络请求. 点击右侧菜单中的[Fil ...
- linux shell鼠标键盘快捷键
- React-Redux 总结
一.定义与功能 React-Redux 将所有组件分成两大类:UI 组件(presentational component)和容器组件(container component) 1.UI 组件特征: ...
- 十一、S3C2440 裸机 — GPIO
11.1 GPIO 介绍 11.1.1 GPIO 管脚 GPIO 即是输入输出端口,S3C2440A 包含了 130 个多功能输入/输出口引脚并且它们为如下显示的八个端口: 端口 A(GPA):25 ...
- python基础练习题08
写一个登录程序,让用户输入账号和密码,输入用户和密码输入正确的话,提示你 xxx,欢迎登录,今天的日期是xxx,程序结束.错误的话,提示账号/密码输入错误, 最多输入3次,如果输入3次都没有登录成功, ...
- DevExpress v19.1新版亮点——WinForms篇(四)
行业领先的.NET界面控件DevExpress v19.1终于正式发布,本站将以连载的形式介绍各版本新增内容.在本系列文章中将为大家介绍DevExpress WinForms v19.1中新增的一些控 ...
- Shiro(二)
1 Shiro的授权 1.1 授权流程 1.2 授权方式 shiro支持三种方式的授权 1.2.1 编程式 通过编写if/else完成授权代码. if(subject.hasRole("ro ...