<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<input type="file" multiple name="image[]" /> <br>
<input type="file" multiple name="image[]" /> <br>
<input type="file" multiple name="image[]" /> <br>
<input type="button" value="提交">
</body>
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(':button').click(function() {
  //formdata储存异步上传数据
var formData = new FormData();
formData.append('image[]',$(':file')[0].files[0]);
formData.append('image[]',$(':file')[1].files[0]);
formData.append('image[]',$(':file')[2].files[0]); $.ajax({
url:"upload.php",
type: 'POST',
data: formData,
//这两个设置项必填
contentType: false,
processData: false,
success:function(data){
}
})
});
</script>
</html>

FormData使用详解

ajax多图片上传demo的更多相关文章

  1. SpringBoot实现图片上传demo&Nginx进行代理显示

    公司项目需要一个图片上传的功能,就图片能上传到服务器(公司用的windows服务器),然后nginx能进行代理访问到就行了,先简单介绍一下nginx,然后再来实现功能. 一.nginx简介 Nginx ...

  2. ajax(form)图片上传(spring)

    第一步:spring-web.xml <!--配置上传下载--> <bean id="multipartResolver" class="org.spr ...

  3. python - django 使用ajax将图片上传到服务器并渲染到前端

    一.前端代码 <!doctype html> <html lang="en"> <head> <meta charset="UT ...

  4. 一般处理程序、Ajax多图片上传带进度条

    <!DOCTYPE html><html><head>    <meta charset="utf-8" />    <tit ...

  5. ajax实现图片上传

    1.创建formData表单,模拟表单传递数据(formData有兼容性问题) var formData = new FormData();2.获取到相应的元素 var jobName = $(&qu ...

  6. jquery Ajax 实现图片上传的功能。

    $('#image').on('change', function () {         var url = "";         var form = new FormDa ...

  7. jquery php ajax多图片上传.上传进度,生成缩略图

    本例用到其他2个php class.upload.php和 functions.php还有css和js以及img文件 下载地址为www.freejs.net/demo/91/down.zip 演示 J ...

  8. struts2 使用ajax进行图片上传

    第一步:引入一个插件    jquery.form.js /*! * jQuery Form Plugin * version: 3.36.0-2013.06.16 * @requires jQuer ...

  9. ajax实现图片上传与进度条

    这里使用的是bootstract的一个插件来实现 详情请查看文档中的进度条 https://v3.bootcss.com/components/ 引入必要的文件 <link href=" ...

随机推荐

  1. Errors were encountered while processing: mysql-server-5.5

    ubuntu 中运行完sudo apt-get install curl之后,最后出现: ldconfig deferred processing now taking place Errors we ...

  2. JZOJ5894【NOIP2018模拟10.5】同余方程

    题目 Description

  3. jQuery4操作表单+属性+样式

    一.动态添加表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  4. win10x软件字体有阴影很模糊的解决方法(软件分辨率与系统分辨率不一致)

    devC++,百度网盘等软件都有这种情况 拿百度网盘举例:界面比较大,不能缩小,字体有阴影比较模糊 解决方法: 桌面右击百度网盘,选择属性, 点击兼容性,更改高DPI设置,替代高DPI缩放行为前面打上 ...

  5. 901. Online Stock Span [短于线性的时间统计单个元素的Span ]

    Span 指这个元素之前连续的小于这个元素的值有多少个 原理: 维护递减栈 这个栈内的元素是递减的序列 新到一个元素x 依次出栈比x小的(也就是这个元素的Span) 这种问题的关键在于 新来的元素如果 ...

  6. mysql 创建定时器

    mysql定时器是系统给提供了event,而oracle里面的定时器是系统给提供的job.废话少说,下面创建表: create table mytable ( id int auto_incremen ...

  7. 关于SQL查询效率 主要针对sql server

    1.关于SQL查询效率,100w数据,查询只要1秒,与您分享:机器情况p4: 2.4内存: 1 Gos: windows 2003数据库: ms sql server 2000目的: 查询性能测试,比 ...

  8. (精简)Spring框架的IoC(替代工厂类实现方法)和AOP(定义规则,约定大于配置)

    Spring的核心框架主要包含两个技术,分别用来处理工厂类,以及事务处理和连接管理的. 两大核心概念 1)  IoC:控制反转,在现在的开发中,如果想建立对象并设置属性,是需要先new对象,再通过se ...

  9. SpringMVC注解开发方式

    环境准备 springmvc版本:spring3.2 需要spring3.2所有jar(一定包括spring-webmvc-3.2.0.RELEASE.jar 工程结构 配置前端控制器(web.xml ...

  10. 【python之路36】进程、线程、协程相关

    线程详细用法请参考:http://www.cnblogs.com/sunshuhai/articles/6618894.html 一.初始多线程 通过下面两个例子的运行效率,可以得知多线程的速度比单线 ...