jquery运用FormData结合Ajax异步上传表单,超实用
首先创建一个formData,其中参数,就是你的form表单,jquery要加0,也可以用document.querySelector("form")得到
var formData = new FormData($("form")[0]);
接着就是异步上传了,其中一定要设置两个值为falese,就是下面的contentType和processData,使之可以上传文件,并不要转成字符串形式,这也是为什么要用$.ajax而不用$.post的原因
$.ajax({
url: "/base/test",
type: 'POST',
data: formData,
contentType: false,
processData: false,
success: function (returndata) {
console.log(returndata);
},
error: function (returndata) {
console.log(returndata);
}
});
上面的url,自行设置,是你要处理的链接。使用这种方法的好处就是不用通过FileReader读取,再转换数据!不过为了实时显示图片,也可以结合filereader使用
jquery运用FormData结合Ajax异步上传表单,超实用的更多相关文章
- html5图片异步上传/ 表单提交相关
1 form 表单 get/post提交时候. action地址(或者啥ajax的url地址) 会涉及到跨域问题 常见跨域问题http://www.cnblogs.com/rainman/archiv ...
- Ajax同时上传表单序列化参数+自定义参数
$.ajax({ type:'POST', url :"<{:U('jiuzhu/edit')}>", data:$.param({'name1':value1,'na ...
- html5+php实现文件的断点续传ajax异步上传
html5+php实现文件的断点续传ajax异步上传 准备知识:断点续传,既然有断,那就应该有文件分割的过程,一段一段的传.以前文件无法分割,但随着HTML5新特性的引入,类似普通字符串.数组的分割, ...
- 基于Flask开发网站 -- 前端Ajax异步上传文件到后台
大家好,我是辰哥~ 辰哥最近利用空闲时间在写一个在线可视化平台,过程中也觉得一些技术还是比较有意思的,所以就以模块化的形式分享出来.如:从网页界面(前端)上传文件到服务器(后端). 放一下该模块的界面 ...
- java使用xheditor Ajax异步上传错误
java使用xheditor Ajax异步上传时候错误如下:the request doesn't contain a multipart/form-data or multipart/mixed s ...
- Spring使用ajax异步上传文件
单文件上传 <!-- 创建文件选择框 --> 文件上传 :<input type="file" id="file" name="fi ...
- ajax异步上传文件和表单同步上传文件 的区别
1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...
- 利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载
利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载 1.页面显示代码 <%@ page language="java" import="java ...
- 【文件上传】文件上传的form表单提交方式和ajax异步上传方式对比
一.html 表单代码 …… <input type="file" class="file_one" name="offenderExcelFi ...
随机推荐
- Geometric regularity criterion for NSE: the cross product of velocity and vorticity 2: $u\times \om\cdot \n\times \om$
在 [Lee, Jihoon. Notes on the geometric regularity criterion of 3D Navier-Stokes system. J. Math. Phy ...
- 2.7 if应用:猜拳游戏
应用:猜拳游戏 <1>运行效果: <2>参考代码: import random player = input('请输入:剪刀(0) 石头(1) 布(2):') player = ...
- Educational Codeforces Round 52 (Rated for Div. 2)
题目链接 A. Vasya and Chocolate 题意 已知钱,价格,赠送规则求最多获得巧克力数 思路常规算即可 代码 #include <bits/stdc++.h> #defin ...
- Django之BBS博客项目
一.登陆功能(验证码) from geetest import GeetestLib from django.contrib import auth #使用极验滑动验证码的登陆 def login(r ...
- 一文掌握 Linux 性能分析之 CPU 篇
本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复「1024」即可领取,欢迎大家关注,二维码文末可以扫. 平常工作会涉及 ...
- 手把手教你写vue插件并发布(一)
vue的插件开发 这篇文章较长,需要一定的阅读时间.这里有一份改善版本的插件笔记,在一个项目下完成开发.测试.发布的全过程.https://www.cnblogs.com/adouwt/p/96555 ...
- NOIP基本算法
NOIP基本算法 1.二分 poj 2018 Best Cow Fences ▪ http://poj.org/problem?id=2018 ▪ 题意:给定一个正整数数列
- 做GUI的随笔
用的SDL库 官方网站是:https://littlevgl.com/ 改网站需要FQ 字库制作网站: https://debugdump.com/t_771.html
- Python的单例模式
一.何为单例模式 单例模式:保证一个类仅有一个实例,并提供一个访问他的全局访问点. 实现某个类只有一个实例的途径: 1.让一个全局变量使得一个对象被访问,但是他不能防止外部实例化多个对象. 2.让类自 ...
- echarts的地图点击事件
1.echarts的地图展示,有时候展示出的数据,虽然鼠标点击上去某个省份或者某个地方会有数据显示,但是点击一下地图没有任何动态效果,如何添加地图点击效果呢,这里自己也是坐下笔记,方便以后使用. 参考 ...