使用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. 序列化 ...
随机推荐
- 应用facebook .net sdk
1.本博客主要介绍如何应用facebook .net SDK,实现发帖.点赞.上传照片视频等功能,更多关于facebook API,请参考:https://developers.facebook.co ...
- rcp(插件开发) The activator X for bundle Y is invalid 解决办法
最近在做插件产品的重构,重构的过程当中难免有一些细节的地方 忘记修改 ,导致出现莫名的问题. 比如这个问题: The activator X for bundle Y is invalid 这个问题从 ...
- [笔记] OS X and iOS 内核开发
一.KEXT包的安全性说明 KEXT 程序包及其包含的所有文件及文件夹必须属于 root 用户(用户 id 是 0) KEXT 程序包及其包含的所有文件及文件夹必须属于 wheel 组(组 id 是 ...
- url在线编码和解码
在工作中,经常遇到encode之后的url.想查看里面的某个参数的时候,很不直观.今天在网上搜了一下对url在线编码和解码的网站.对我来说,使用起来很方便.而且这个网站里面,不仅仅有对url的编码和解 ...
- 权限系统设计实现MVC4 + WebAPI + EasyUI + Knouckout
权限系统设计实现MVC4 + WebAPI + EasyUI + Knouckout (一) 一.前言 之前的博客一直都还没写到框架的实现及权限系统,今天开始写我的权限系统,我以前做过的项目基本上都有 ...
- HDFS中文件的压缩与解压
HDFS中文件的压缩与解压 文件的压缩有两大好处:1.可以减少存储文件所需要的磁盘空间:2.可以加速数据在网络和磁盘上的传输.尤其是在处理大数据时,这两大好处是相当重要的. 下面是一个使用gzip工具 ...
- CF 192 DIV.2
总结一下这场比赛,就是我太SB了.说多了都是泪. A,大水题. B,根据题意,可以肯定有一个城市是可以与所有城市相连的,直接找到该点然后输出该点与其他所有点相连即可. int x[111111] , ...
- 在 Cordova/Phonegap for Android 中包含中文文件名的页面
在 Cordova/Phonegap for Android 中包含中文文件名的页面 本贴首发于: http://xuekaiyuan.com/forum.php?mod=viewthread& ...
- Java中数组Arrays.binarySearch,快速查找数组内元素位置
在数组中查找一个元素,Arrays提供了一个方便查询的方法.Arrays.binarySearch(): 测试列子: public class MainTestArray { public stati ...
- linux主机load average的概念&&计算过程&&注意事项
最近开发的一个模块需要根据机房各节点的负载情况(如网卡IO.load average等指标)做任务调度,刚开始对Linux机器load average这项指标不是很清楚,经过调研,终于搞清楚了其计算方 ...