<!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. drools规则管理Guvnor的安装

    今天找了一圈没看到tomcat下如何安装Guvnor,自己试了安装一把把流程记录下来. 1.JBOSS官方下载Guvnor(或者网上找找很多war包) 2.下载tomcat,安装(保证8080 ind ...

  2. main函数执行前后还会发生什么

    问题分析 首先main()函数只不过是提供了一个函数入口,在main()函数中的显示代码执行之前,会由编译器生成_main函数,其中会进行所有全局对象的构造以及初始化工作.简单来说对静态变量.全局变量 ...

  3. PHP7中标量类型declare的用法详解

    这篇文章主要介绍了PHP7标量类型declare用法,结合实例形式分析了PHP7中标量类型declare的功能.特性与相关使用技巧,需要的朋友可以参考下 本文实例讲述了PHP7标量类型declare用 ...

  4. 深入浅出 Java Concurrency (11): 锁机制 part 6 CyclicBarrier[转]

    如果说CountDownLatch是一次性的,那么CyclicBarrier正好可以循环使用.它允许一组线程互相等待,直到到达某个公共屏障点 (common barrier point).所谓屏障点就 ...

  5. 软件-浏览器-GoogleChrome：Google Chrome

    ylbtech-软件-浏览器-GoogleChrome:Google Chrome Google Chrome是一款由Google公司开发的网页浏览器,该浏览器基于其他开源软件撰写,包括WebKit, ...

  6. Golang数据库操纵对IN语句的支持

    一: 在实际的工程项目中,SQL通常使用预编译的形式进行执行操纵,可以有效的防止SQL注入的风险,提高编码的规范性.golang中使用sqlx进行sql查询的时候,在使用in语句在一个集合中查询的时候 ...

  7. Tensorflow技巧

    1.尽量控制图片大小在1024以内,不然显存会爆炸. 2.尽量使用多GPU并行工作,训练下降速度快. 3.当需要被检测的单张图片里物体太多时,记得修改Region_proposals的个数 4.测试的 ...

  8. 2019-8-31-dotnet-控制台读写-Sqlite-提示-no-such-table-找不到文件

    title author date CreateTime categories dotnet 控制台读写 Sqlite 提示 no such table 找不到文件 lindexi 2019-08-3 ...

  9. LINUX超级用户（权限）在系统管理中的作用

    1.对任何文件.目录或进程进行操作: 但值得注意的是这种操作是在系统最高许可范围内的操作:有些操作就是具有超级权限的root也无法完成: 比如/proc 目录,/proc 是用来反应系统运行的实时状态 ...

  10. qq邮箱问卷，测试不支持form表单

    想做个类似苹果调查问卷的: 找到qq邮箱的代码编辑器: 写好我们的网页(h5) <!DOCTYPE html> <html lang="en"> <h ...