<!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. python 拷贝某个文件到另一个目录下

    python的shutil包含有很多文件拷贝的函数,各种各样的,要实现我文章题目的目的,使用shutil.copy函数即可 shutil.copy(文件的路径,另一个目录)

  2. js中call、apply、bind的区别和应用

    一.总体概述 这三个方法都是改变函数本身的this指向的,但是略有不同 1.call 使用方法:函数名.call(this指向,展开的参数列表); 如果传入的this指向是null或者是undifin ...

  3. jeecms添加站点

    Step1:点击[站点管理],然后点击[添加站点]. Step2:按照下图填写,注意[路径]这一栏!!这里我随便写了个[aaa]. Step3:这个时候在本地部署的tomcat的模板路径:tomcat ...

  4. Flask session到期时间设置 用户登录与登出

    flask版本 1.1.1 最近学习Flask开发,看官方文档产生疑问,就是session有效期的问题,默认貌似是没有有效期的,只有关闭浏览器session才会失效,其实控制session的有效期非常 ...

  5. C/C++ - 类中成员变量是引用

    C++引用 引用在定义时必须初始化,否则编译时便会报错.如果类(自定义类型)的成员是引用类型,需要注意一些问题. 引用成员变量 并不为这个变量新辟空间:类对象做成员变量则是要对其新辟一段空间的 不能有 ...

  6. 国内在Amazon fireTV或者fire平板下载应用（netflix\hulu\YouTube）的方法

    1.首先需要vpn翻墙至U.S. 2.需要一个美国亚马逊账户,并设置收货地址 (Manage Your Fire & Kindle 1-Click Payment Settings ),如果只 ...

  7. GIL(全局解释器锁) 理解

    GIL 锁,全局解释器锁,作用就是,限制多线程同时执行,保证同一时间内只有一个线程在执行. ​ 线程非独立的,所以同一进程里线程是数据共享,当各个线程访问数据资源时会出现竞状态,即数据可能会同时被多个 ...

  8. light oj 1149 Factors and Multiples(二分匹配)

    LightOJ1149 :Factors and Multiples 时间限制:2000MS    内存限制:32768KByte   64位IO格式:%lld & %llu 描述 You w ...

  9. 读书笔记--Head First 设计模式 目录

    1.设计模式入门 2.观察者模式 3.装饰者模式 4.工厂模式 5.单件模式 6.命令模式 7.适配器模式与外观模式 8.模板方法模式 9.迭代器与组合模式 10.状态模式 11.代理模式 12.复合 ...

  10. 使用Jedis操作Redis-使用Java语言在客户端操作---对key的操作

    //添加String类型的模拟数据. jedis.set("mykey", "2"); jedis.set("mykey2", " ...