前段时间做了个手机端的图片上传,为了用户体验,用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请求并上传文件的更多相关文章

  1. H5 FormData对象的使用——进行Ajax请求并上传文件

    XMLHttpRequest Level2 添加了一个新的接口——FormData .[ 主要用于发送表单数据,但也可以独立使用于传输键控数据.与普通的Ajax相比,它能异步上传二进制文件 ] 利用F ...

  2. 请求与上传文件,Session简介,Restful API,Nodemon

    作者 | Jeskson 来源 | 达达前端小酒馆 请求与上传文件 GET请求和POST请求 const express = require('express'); const app = expre ...

  3. Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用

    1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...

  4. ajax无刷新上传文件

    网页上传文件最简单的方式就是通过表单上传了,但是在提交表单的时候会导致网页刷新,但有的时候我们不想网页刷新,有什么办法呢,我们可以使用ajax上传文件来做到这一点.只有ajax还不行,还需要JavaS ...

  5. HTML5+AJAX原生分块上传文件的关键参数设置

    processData:false 这是jquery.ajax的一个参数.默认值为true,表示会将非字符串对象自动变成k1=v1&k2=v2的形式,例如一个数组参数{d:[1,2]},到服务 ...

  6. Ajax 无刷新上传文件插件 uploadify 的使用

    在表单中无法直接使用 Ajax 上传文件,解决的思路可以是使用插件无刷新地上传文件,返回文件上传后的地址,然后把该地址作为 Ajax 的参数传递给服务器端进行数据库处理.可以使用 uploadify ...

  7. ajax:html5上传文件,上传之前可以实现本地预览

    本主题主要涉及两个新内容: 1.上传文件(主要使用了FormData) 2.本地预览(主要使用了FileReader) html5的FormData其实就是平时的Form表单,只是html5可以直接新 ...

  8. c#代码发送post请求,上传文件(并带其他参数)

    本人对post理解不深,前段时间遇到一个需要用c#代码发送post请求上传文件的业务,于是参考了几篇帖子,加上自身实践写出了如下代码.写的比较low 望各位大大指正^_^. 业务需求: 对方给了一个接 ...

  9. ajax json用法 上传文件 登录

     1. json  json  是一种数据结构  跨平台跨语言   1. python中json数据的转换   1.数据类型    字符串 数字 布尔值 列表 字典 None       2. 序列化 ...

随机推荐

  1. 一个简单的Garbage Collector的实现

    一个简单的Garbage Collector的实现 前言: 最近看了google的工程师写的一个非常简单的垃圾收集器,大概200多行C代码,感叹大牛总能够把复杂的东西通过很简单的语言和代码表达出来.为 ...

  2. 分享Syslinux4USB 0.3源码——改自神雕大侠作品

    神雕大侠写的Syslinux4USB是我在无忧论坛里找到的工具,他是2011年写出的,他在帖子里也发布了源码,可惜那个帖子里的链接失效了,我为了这个工具的源码找了2年,终于在Google上搜到了,并且 ...

  3. 【javascript】判断浏览设备是手机还是电脑

    判断页面浏览设备是手机还是电脑,代码如下: function browserRedirect() { var sUserAgent = navigator.userAgent.toLowerCase( ...

  4. XSD实例

    XSD实例 在前面的XSD笔记中,基本上是以数据类型为主线来写的,而在我的实际开发过程中,是先设计好了XML的结构(元素.属性),并写好了一份示例,然后再反过来写XSD文件(在工具生成的基础上修改), ...

  5. 通过实体反射实现CriteriaQuery并列条件查询

    将实体反射之后获取查询字段的值,并添加到Predicate对象数组中 public Predicate getPredicateAnd(T entity, Root<T> root, Cr ...

  6. AOP in Spring

    AOP in Spring 是不是已经对包裹在每个业务周围的异常处理.事务管理.性能监控.日志记录等重复出现的代码感到厌倦,那么是时候轮到AOP出场了.不得不承认程序员的惰性有时候会是一件好事(毕竟提 ...

  7. Twitter Storm:单机环境的安装与配置

    Twitter Storm:单机环境的安装与配置 好久没写博客了,这一段时间一直被导师push着做毕业设计.由于目前的方向偏向于图像识别检索,毕设打算做一个基于分布式计算平台的图像检索系统,查阅相关资 ...

  8. 软件设计师.NET认证考试测试卷(试题及答案)

    软件设计师.NET认证考试测试卷 注意事项:用蓝.黑色钢笔答题.保持卷面整洁. 得分 阅卷人 一.单项选择(40分,每小题1分) 1.以下标识符中不全是关键字的是(D  ) A.case for in ...

  9. Embedded Linux Primer----嵌入式Linux基础教程--导论

    第一章 导论 在这一章里(将要学习到) 为什么是Linux 嵌入式Linux现状 开源和GPL(译者:通用公共许可证) 标准和有关团体 本章总结 放弃专有操作系统正在许多传统嵌入式操作系统公司引起一阵 ...

  10. C++ 头文件系列(array)

    注意,该头文件仅在C++11中标准才开始出现. 简介 与语言内置的数组一样, array类模版支持几乎所有内置数组包含的特性: 顺序的(sequence) 内存连续的(contiguous stora ...