基于 jQuery

HTML:

<form id="form" enctype="multipart/form-data">
<input type="text" name="name" />
<input type="text" name="desc" />
<input type="file" name="image" id="doc0" /> <button type="button" id="submit" > 提交 </button>
</form>

JS:

// 提交表单
$('#submit').click(function () { // 创建FormData对象
var data = new FormData($('#form')[0]); // 为FormData对象添加数据
$.each($('#doc0')[0].files, function(i, file) {
data.append('image', file);
}); $.ajax({
url:'yoururl',
type:'POST',
data:data,
cache: false,
contentType: false, /* 不可缺 */
processData: false, /* 不可缺 */
success:function(result){
// 这里是你的成功逻辑
}
});
});

jQuery ajax 提交表单图片的更多相关文章

  1. JQuery ajax提交表单及表单验证

    JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目   注:经过验证,formValidator只适合一个 ...

  2. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  3. Jquery ajax提交表单几种方法详解

    [导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...

  4. jquery Ajax提交表单数据

    //表单中控件的name要和实体类字段属性一致 $.ajax({ cache: true, type: "POST", url:ajaxCallUrl, data:$('#your ...

  5. jquery ajax 提交表单(file && input)

    用到的插件 jquery.js jquery.form.js[http://malsup.github.io/jquery.form.js] 提交页面 <form enctype="m ...

  6. Validator验证Ajax提交表单的方法

    Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...

  7. jquery ajax提交表单数据的两种方式

    http://www.kwstu.com/ArticleView/kwstu_201331316441313 貌似AJAX越来越火了,作为一个WEB程序开发者要是不会这个感觉就要落伍,甚至有可能在求职 ...

  8. jquery实现ajax提交表单

    一般情况下,我们提交form表单采用的是submit的方法,典型的场景如下. <form id="thisForm" method="post" acti ...

  9. php使用jquery Form ajax 提交表单,并上传文件

    在html5中我们通过FormData就可以ajax上传文件数据,不过因为兼容问题.我们选用jquery.form.min.js来进行ajax的表单提交.   一.jquery.form.js下载地址 ...

随机推荐

  1. Oracle 字段监控 ( column monitor)

    Oracle 字段监控 ( column monitor) */--> Oracle 字段监控 ( column monitor) Table of Contents 1. 开启与关闭 2. 字 ...

  2. 溢出overflow: hidden

    如果要防止内容把div容器或者表格撑大,可以在CSS中设置一.overflow: hidden; 表示如果内容超出容器大小,就把超出部分隐藏(相当于切掉)二.overflow: scroll; 这个表 ...

  3. 20 Django REST Framework 更改PUT/PATCH/DELETE的传参字段,默认为pk

    01-lookup_field 默认为 lookup_field='pk' 更改后的效果:

  4. tensorflow卷积神经网络与手写字识别

    1.知识点 """ 基础知识: 1.神经网络(neural networks)的基本组成包括输入层.隐藏层.输出层.而卷积神经网络的特点在于隐藏层分为卷积层和池化层(po ...

  5. JAVA多线程程序ProgressBar

    JAVA多线程程序ProgressBar 题目简介: 思维导图: 实验代码:建议先看CalThread类,计算线程的实现,再作基本CalFrame类的界面, 然后作ReadThread类,结合CalF ...

  6. 五十三:WTForms表单验证之常用验证器

    Email:验证数据是否为邮箱EqualTo:验证此字段的数据是否和另一个字段的值相等,常用与校验密码和确认密码InputRequired:检验数据必传Length:校验数据长度NumberRange ...

  7. 如何实现Eclipse默认编码为UTF-8

    1 Window->Preferences->General->Workspace,右边Text file encoding选择Other->UTF-8 2 Window-&g ...

  8. Python之数据库操纵工具

    前言 基于原生模块:pymysql 推荐教程 Python 数据库处理的类库 pymysql [python原生模块] SQLAchemy [ORM框架] Python3 MySQL 数据库连接 - ...

  9. Hibernate5+Spring4整合

    (1) pom.xml <!--Spring Object/Relational Mapping --> <dependency> <groupId>org.spr ...

  10. C#编程 线程,任务和同步(1) 基础认识

    线程 对于所有需要等待的操作,例如移动文件,数据库和网络访问都需要一定的时间,此时就可以启动一个新的线程,同时完成其他任务.一个进程的多个线程可以同时运行在不同的CPU上或多核CPU的不同内核上. 线 ...