使用FormData,进行Ajax请求并上传文件
前段时间做了个手机端的图片上传,为了用户体验,用ajax交互,发现了FromData对象,这里有详细解释https://developer.mozilla.org/zh-CN/docs/Web/API/FormData
以下直接粘贴代码,这里使用JQuery,但是老版本的JQuery比如1.2是不支持的,最好使用2.0或更新版本。注:代码转自他人blog,感觉比本人代码清晰易懂,故而转之。
1、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>
2、JQuery代码
function doUpload() {
var formData = new FormData($( "#uploadForm" )[0]);
$.ajax({
url: 'http://localhost:8080/cfJAX_RS/rest/file/upload' ,
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (returndata) {
alert(returndata);
},
error: function (returndata) {
alert(returndata);
}
});
}
使用FormData,进行Ajax请求并上传文件的更多相关文章
- H5 FormData对象的使用——进行Ajax请求并上传文件
XMLHttpRequest Level2 添加了一个新的接口——FormData .[ 主要用于发送表单数据,但也可以独立使用于传输键控数据.与普通的Ajax相比,它能异步上传二进制文件 ] 利用F ...
- 请求与上传文件,Session简介,Restful API,Nodemon
作者 | Jeskson 来源 | 达达前端小酒馆 请求与上传文件 GET请求和POST请求 const express = require('express'); const app = expre ...
- Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用
1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...
- ajax无刷新上传文件
网页上传文件最简单的方式就是通过表单上传了,但是在提交表单的时候会导致网页刷新,但有的时候我们不想网页刷新,有什么办法呢,我们可以使用ajax上传文件来做到这一点.只有ajax还不行,还需要JavaS ...
- HTML5+AJAX原生分块上传文件的关键参数设置
processData:false 这是jquery.ajax的一个参数.默认值为true,表示会将非字符串对象自动变成k1=v1&k2=v2的形式,例如一个数组参数{d:[1,2]},到服务 ...
- Ajax 无刷新上传文件插件 uploadify 的使用
在表单中无法直接使用 Ajax 上传文件,解决的思路可以是使用插件无刷新地上传文件,返回文件上传后的地址,然后把该地址作为 Ajax 的参数传递给服务器端进行数据库处理.可以使用 uploadify ...
- ajax:html5上传文件,上传之前可以实现本地预览
本主题主要涉及两个新内容: 1.上传文件(主要使用了FormData) 2.本地预览(主要使用了FileReader) html5的FormData其实就是平时的Form表单,只是html5可以直接新 ...
- c#代码发送post请求,上传文件(并带其他参数)
本人对post理解不深,前段时间遇到一个需要用c#代码发送post请求上传文件的业务,于是参考了几篇帖子,加上自身实践写出了如下代码.写的比较low 望各位大大指正^_^. 业务需求: 对方给了一个接 ...
- ajax json用法 上传文件 登录
1. json json 是一种数据结构 跨平台跨语言 1. python中json数据的转换 1.数据类型 字符串 数字 布尔值 列表 字典 None 2. 序列化 ...
随机推荐
- vijos1004 博弈论
一道挺简单的博弈论题 感觉自己也没有很规范的学过博弈论吧,就是偶尔刷到博弈论的题目,感受一下推导的过程,大概能领悟些什么 我们设2001.11.4必败,推上去,即2001.10.4和2001.11.3 ...
- LevelDB架构
LevelDB系列之整体架构 LevelDb本质上是一套存储系统以及在这套存储系统上提供的一些操作接口.为了便于理解整个系统及其处理流程,我们可以从两个不同的角度来看待LevleDb:静态角度和动 ...
- cocos2d-x-2.2.0_win7+vs2010
cocos2d-x-2.2.0_win7+vs2010搭建_eclipse+ndk-r9+cygwin搭建_教程以及编译问题汇总 声明:我是才用c/c++和cocos2d-x的如果有错误欢迎指出 文章 ...
- GEF-whole-upload教程中遇到的问题及解决方案
最近在学习GEF开发,使用的是GEF-whole-upload这个教程.由于教程当时所使用的版本与本人使用的版本有一些差异,中间出现了不少问题,现在将解决方案分享给大家. 本人使用的Eclipse版本 ...
- IceMx.Mvc 我的js MVC 框架五、完善植物大战僵尸(雏形版增加动画)
有图有真相 说明 实在找不到僵尸的素材,从网上扒了一个山寨的僵尸,只有4张的一个连续图片,所以动作有点僵硬,植物的图片是自己处理的,非专业所以……咳咳!. 背景是自己抠下来2块儿拼接的,看在这么辛苦的 ...
- ${pageContext.request.contextPath}的作用
刚开始不知道是怎么回事,在网上也查找了一些资料,看了还是晕. 看了另一个大侠的,终于有了点眉目. 那位大侠在博客中这样写道“然后在网上找,更让我郁闷的事,TMD!网上“抄袭”的真多啊!而且扯了一大堆! ...
- EventBus实现 - 发布订阅 - XML加载
EventBus实现 - 发布订阅 - XML加载 受到CQRS的影响,写了个EventBus,能实现发布订阅模式执行event,在DDD模型中,可以使用如下代码触发事件: EventBus bus ...
- 史上最全条件编译解析 #ifdef #ifndef #undef #else #endif
C语言和C++语言程序中广泛存在着#ifdef或#ifndef等条件编译语句,本篇就系统介绍下他们的用法. 这几个宏是为了进行条件编译.一般情况下,源程序中所有的行都参加编译.但是有时希望对其中一部分 ...
- VS中为类,函数代码自动添加版权注释信息
以web项目为例: 一:给类加注释 1.在visual studio 的安装路径下 如:[盘符]:\Program files\Microsoft Visual Studio 8\Com ...
- 算法线性编程珠玑读书笔记之----->使用线性算法求解连续子序列的最大和
这段时间笔者几篇文章介绍了改算法线性的文章. 关联文章的地址 这个算法我在我的博客里应用动态规划做过,详细实现请参阅我的dp板块,下面给出书上最快的算法,时间复杂度为O(n),称之为线性算法. #in ...