• 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请求的更多相关文章

  1. koa2:通过Ajax方式上传文件,使用FormData进行Ajax请求

    koa2通过表单上传的网上很多,但通过Ajax方式上传文件,使用FormData进行Ajax请求,不好找. 参考了这个用base64上传图片的例子.https://github.com/Yuki-Mi ...

  2. 通过Ajax方式上传文件,使用FormData进行Ajax请求

    通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...

  3. [转] 通过Ajax方式上传文件,使用FormData进行Ajax请求

    通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...

  4. Ajax方式上传文件

    用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 For ...

  5. 上传文件,使用FormData进行Ajax请求,jsoncallback跨域

    通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...

  6. 通过Ajax方式上传文件(input file),使用FormData进行Ajax请求

    <script type="text/jscript"> $(function () { $("#btn_uploadimg").click(fun ...

  7. Ajax方式上传文件报错"Uncaught TypeError: Illegal invocation"

    今天使用ajax上传文件时,出现了错误.数据传输的方式是通过定义formData完成的,提交的文件对象也设置为dom对象,但是还是不能发送请求.F12看到后台报了个错误:Uncaught TypeEr ...

  8. jQuery Ajax方式上传文件实现暂停或取消上传

    未上传时要实现取消,很简单... 但如果用户点击了上传,并加载了进度信息... 2017-05-04再次改进.在上传过程中用户可以按 Esc 来取消上传(取消当前上传,或者是全部上传)... 也可以在 ...

  9. ajax如何上传文件(整理)

    ajax如何上传文件(整理) 一.总结 一句话总结:用FormData,FormData+ajax=异步上传二进制文件 <form enctype="multipart/form-da ...

随机推荐

  1. chrome插件2

    转自:http://www.codeceo.com/article/15-chrome-extension.html 1. Web Developer 支持Chrome的Web Developer扩展 ...

  2. 2019-11-29-C#-序列类为-xml-可以使用的特性大全

    title author date CreateTime categories C# 序列类为 xml 可以使用的特性大全 lindexi 2019-11-29 8:59:2 +0800 2018-6 ...

  3. poj 1664 放苹果(dfs)

    放苹果 Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 30284   Accepted: 19098 Description ...

  4. GitHub源码攻击事件

    黑客擦除了微软多达392个代码存储库,并提出勒索要求.此前,黑客攻击了包含微软在内的大批受害者的Git存储库,删除了所有源代码和最近提交的内容,并留下了支持比特币支付的赎金票据. 勒索信息如下: “要 ...

  5. 在centOS7.2上编译gcc4.1.2

    1.下载安装gcc4.1.2安装包  wget ftp://ftp.gnu.org/gnu/gcc/gcc-4.1.2/gcc-4.1.2.tar.bz2 注:其他版本的安装包可以在上级目录寻找到. ...

  6. jmeter上传文件tips

    转载:https://blog.csdn.net/aduocd/article/details/87916676 转载:https://www.cnblogs.com/landhu/p/8980195 ...

  7. python _str_方法

    _str_方法: 使用:如: class Car: def __init__(self,newWheelNum,newColor): self.wheelNum=newWheelNum self.co ...

  8. Java注解Annotation与自定义注解详解

    Java注解简介 开发中经常使用到注解,在项目中也偶尔会见到过自定义注解,今天就来探讨一下这个注解是什么鬼,以及注解的应用场景和如何自定义注解. 下面列举开发中常见的注解 @Override:用于标识 ...

  9. vue interceptors(拦截器)

    拦截器 顾名思义: 就是半路个您劫持, 拦截器 其实在项目和自己写demo中,总会遇到请求方面需要在请求头里面做判断或者添加一些东西, 这时候 vue 中应用中axios的 interceptors  ...

  10. python 脚本制作

    U盘拷贝 当U盘插入主机时 被系统识别挂载后 通过python代码自动的去读取U盘中的资料并且进行拷贝 寄存在U盘上的 把硬盘上的资料进行读取并移动到U盘里 有点像 繁殖性 传输性 破坏性 破坏系统或 ...