ajax提交form表单 | 易学教程

form表单(文件上传)

阅读更多关于 form表单(文件上传)

在生成input标签的时候可以指定input标签的类型为file类型 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h4>{{ error_message }}</h4> <form action="/index/" method="post"> {% csrf_token %} <p><input type="file" name="up_file"></p> <input type="submit"> </form> </body> </html> 此时，在网页上页示如下如果网页上提交的是用户名和密码等，通过键值对发送到服务端。一组键值代表一个标签及标签对应的值。在网页上选择一张图片，并使用 post 方式提交，在服务端打印 request.POST def index(request): if request.method=="POST": print(request.POST) return render(request,"index.html",locals()) 打印的信息如下： <QueryDict: {'csrfmiddlewaretoken': ['opmSmENIrgdGJJN'], 'up_file':

application/x-www-form-urlencode

阅读更多关于 application/x-www-form-urlencode

application/x-www-form-urlencode 我们在提交表单的时候，form表单参数中会有一个enctype的参数。enctype指定了HTTP请求的Content-Type。默认情况下，HTML的form表单的enctype=application/x-www-form-urlencoded。 application/x-www-form-urlencoded是指表单的提交，并且将提交的数据进行urlencode。默认情况下，我们所有的表单提交都是通过这种默认的方式实现的。在火狐浏览器下，我们可以看一下提交数据的过程：我们可以看到Content-type： Content-Type application/x-www-form-urlencoded; charset=UTF-8 然后继续看一下原始请求数据，原始的请求数据被urlencode了。 Ajax默认也是通过HTTP application/x-www-form-urlencoded提交数据。可以看下Jquery的源码： multipart/form-data 一般情况下，我们如果要在表单中上传文件，一般会将form的enctype参数设置为multipart/form-data。这种方式只支持POST的请求方式。 Contype-Type=multipart/form-data情况的时候

html 5 模仿 form 提交file 文件之FormData

阅读更多关于 html 5 模仿 form 提交file 文件之FormData

使用xhtr 2 可以实现前端提交无刷新提交form表单 api 参考mdn : https://developer.mozilla.org/zh-CN/docs/Web/API/FormData/%E5%88%A0%E9%99%A4 文章参考 http://blog.csdn.net/u014607184/article/details/52372551#comments 使用ajax 请求时注意 $.ajax({ url : this .baseUrl+ 'updateHead' , type : 'POST' , data : formData, /** * 必须false才会避开jQuery对 formdata 的默认处理 * XMLHttpRequest会对 formdata 进行正确的处理 */ processData : false , /** *必须false才会自动加上正确的Content-Type */ contentType : false , success : function(responseStr) { alert( "成功：" + JSON.stringify(responseStr)); }, error : function(responseStr) { alert( "失败:" + JSON.stringify(responseStr));

四种常见的 POST 提交数据方式

阅读更多关于四种常见的 POST 提交数据方式

文章目录 application/x-www-form-urlencoded multipart/form-data application/json text/xml HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 这几种。其中 POST 一般用来向服务端提交数据，本文主要讨论 POST 提交数据的几种方式。我们知道，HTTP 协议是以 ASCII 码传输，建立在 TCP/IP 协议之上的应用层规范。规范把 HTTP 请求分为三个部分：状态行、请求头、消息主体。类似于下面这样： <method> <request-url> <version> <headers> <entity-body></entity-body></headers></version></request-url></method> 协议规定 POST 提交的数据必须放在消息主体（entity-body）中，但协议并没有规定数据必须使用什么编码方式。实际上，开发者完全可以自己决定消息主体的格式，只要最后发送的 HTTP 请求满足上面的格式就可以。但是，数据发送出去，还要服务端解析成功才有意义。一般服务端语言如 php、python 等，以及它们的 framework，都内置了自动解析常见数据格式的功能

表单提交enctype参数详解之：application/x-www-form-urlencode和multipart/form-data

阅读更多关于表单提交enctype参数详解之：application/x-www-form-urlencode和multipart/form-data

四种常见的 POST-------- content-type数据提交方式

阅读更多关于四种常见的 POST-------- content-type数据提交方式

HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 这几种。其中 POST 一般用来向服务端提交数据，本文主要讨论 POST 提交数据的几种方式。我们知道，HTTP 协议是以 ASCII 码传输，建立在 TCP/IP 协议之上的应用层规范。规范把 HTTP 请求分为三个部分：状态行、请求头、消息主体。类似于下面这样： <method> <request-URL> <version> <headers> <entity-body> 协议规定 POST 提交的数据必须放在消息主体（entity-body）中，但协议并没有规定数据必须使用什么编码方式。实际上，开发者完全可以自己决定消息主体的格式，只要最后发送的 HTTP 请求满足上面的格式就可以。但是，数据发送出去，还要服务端解析成功才有意义。一般服务端语言如 php、python 等，以及它们的 framework，都内置了自动解析常见数据格式的功能。服务端通常是根据请求头（headers）中的 Content-Type 字段来获知请求中的消息主体是用何种方式编码，再对主体进行解析。所以说到 POST 提交数据方案，包含了 Content-Type 和消息主体编码方式两部分。下面就正式开始介绍它们。 application/x-www

HTTP 请求头与请求体

阅读更多关于 HTTP 请求头与请求体

HTTP Request HTTP 的请求报文分为三个部分请求行、请求头和请求体，格式如图：一个典型的请求消息头域，如下所示：　　POST/GET http://download.microtool.de:80/somedata.exe 　　Host: download.microtool.de 　　Accept: */* 　　Pragma: no-cache 　　Cache-Control: no-cache 　　Referer: http://download.microtool.de/ 　　User-Agent:Mozilla/4.04[ en]( Win95;I;Nav) 　　Range:bytes=554554- Request Line:请求行请求行（Request Line）分为三个部分：请求方法、请求地址和协议及版本，以CRLF(rn)结束。HTTP/1.1 定义的请求方法有8种：GET、POST、PUT、DELETE、PATCH、HEAD、OPTIONS、TRACE,最常的两种GET和POST，如果是RESTful接口的话一般会用到GET、POST、DELETE、PUT。 Request Methods 注意，仅有POST、PUT以及PATCH这三个动词时会包含请求体，而GET、HEAD、DELETE、CONNECT、TRACE

content-type的几种取值

阅读更多关于 content-type的几种取值

参考： http://stackoverflow.com/questions/4007969/application-x-www-form-urlencoded-or-multipart-form-data 四种常见的 POST 提交数据方式我们知道，HTTP 协议是以 ASCII 码传输，建立在 TCP/IP 协议之上的应用层规范。规范把 HTTP 请求分为三个部分：状态行、请求头、消息主体。类似于下面这样： <method> <request-url> <version> <headers> <entity-body></entity-body></headers></version></request-url></method> 协议规定 POST 提交的数据必须放在消息主体（entity-body）中，但协议并没有规定数据必须使用什么编码方式。实际上，开发者完全可以自己决定消息主体的格式，只要最后发送的 HTTP 请求满足上面的格式就可以。但是，数据发送出去，还要服务端解析成功才有意义。一般服务端语言如 php、python 等，以及它们的 framework，都内置了自动解析常见数据格式的功能。服务端通常是根据请求头（headers）中的 Content-Type 字段来获知请求中的消息主体是用何种方式编码，再对主体进行解析。所以说到 POST 提交数据方案，包含了

异步上传文件并获得返回值（完全跨域）

阅读更多关于异步上传文件并获得返回值（完全跨域）

异步上传文件并获得返回值（完全跨域） AJAX可以进行数据的异步请求，但对于文件和跨域问题却束手无策。 Jsonp可以进行跨域数据的异步请求，但同样不能使用于文件。 <form>表单可以进行跨域数据和文件的上传，但却会使页面跳转。那么如何同时实现“异步”+“跨域”+“文件”+“返回值”这几个特性呢？方法如下：原理：将<form>表单通过一个iframe来submit，也就是将<form>的target属性设置为一个iframe的id，这样<form>的action URL就会在这个iframe中打开，那么服务器的返回数据也就会输出到iframe中了。最后再通过主页面也iframe之间的交互完成对返回数据的读取（这涉及到跨域问题，文章后面将介绍此问题的解决方法）。基本结构：前端部分（当前域名：www.test.com，与form中的action域名相同） <form action="http://www.test.com/io.php" method="POST" enctype="multipart/form-data" target="upload"> <input type="file" name="upload_file" /> <input type="submit" value="开始上传" /> </form> <iframe name="upload"

java文件上传下载解决方案

阅读更多关于 java文件上传下载解决方案

javaweb 上传文件上传文件的jsp中的部分上传文件同样可以使用form表单向后端发请求，也可以使用 ajax向后端发请求 1. 通过form表单向后端发送请求 <form id="postForm" action="${pageContext.request.contextPath}/UploadServlet" method="post" enctype="multipart/form-data"> <div class="bbxx wrap"> <inputtype="text" id="side-profile-name" name="username" class="form-control"> <inputtype="file" id="example-file-input" name="avatar"> <button type="submit" class="btn btn-effect-ripple btn-primary">Save</button> </div> </form> 改进后的代码不需要form标签，直接由控件来实现。开发人员只需要关注业务逻辑即可。JS中已经帮我们封闭好了 this .post_file = function () { $.each( this .ui.btn, function (i, n) { n.hide();});

订阅 ajax提交form表单