1. method 为 get 时

  enctype :x-www-form-urlencoded(默认), 把form数据append到对应的url后面;

2. method 为 post 时

   Browser 把form 数据封装到http body 后面;

  a. 没有type=file控件:

    enctype :application/x-www-form-urlencoded (默认) 就可以了;

  b. 有type=file控件:

    enctype:multipart/form-data(显式指定),Browsert会把表单以控件为单位分割,并为每个部分加上Content-Disposition(form-data或者file),Content-Type(默认为text/plain),name(控件name)等信息,并加上分隔符(boundary)

实际业务场景:在提交表单时,表单中存在name控件,同时包含上传的file; 现需要将后台返回信息回显过来;

  • 用自带的form报表提交,在from 标签上加 enctype="multipart/form-data";

  可以正常提交 name属性和 file文件,但返回数据前端无法接收到;

  • 用 ajax提交表单数据,用ajax,post等方式处理;

  要么可以提交单一的file 文件,要么通过 $('form').serialize() 序列化实现提交 name属性的控件;

  • 解决方案:

  借用 jquery.form.js插件(其中另外用了 jquery.validate.js用于数据校验,此插件独立于jquery.form.js),实现代码如下:

var options = {
rules: {
...,
},
messages: {
...,
}
}; function showResponse(responseText, statusText) {
  if (statusText == 'success') {
alert('success');
  }else{
    alert('failed');
  }
} //确定
function saveSubmit($from) {
  validator = $from.validate(options);
  $from.submit(function() {
$(this).ajaxSubmit({
  type : "post",
  url : $from.attr('action'),
  beforeSubmit : function(formData, jqForm, options) {
    return $from.valid();
  },
  success : showResponse
});
return false; // 此处必须返回false,阻止常规的form提交
  });
}

  

form 表单提交浏览器的enctype(编码方式)的更多相关文章

  1. Form表单提交数据的几种方式

    一.submit提交 在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮(<input type='submit'>)就可以进行数据的提交, ...

  2. form 表单提交的另一种方式 js

    <html> <head> <script type="text/javascript"> function formSubmit() { fm ...

  3. form表单提交数据编码方式和tomcat接受数据解码方式的思考

    http://blog.sina.com.cn/s/blog_95c8f1ac010198j2.html *********************************************** ...

  4. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  5. form表单提交与ajax消息传递

    form表单提交与ajax消息传递 1.前后端传输数据编码格式contentType: urlencoded 对应的数据格式:name=xxx&password=666 后端获取数据:requ ...

  6. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  7. Form 表单提交的几种方式

    简单的总结一下form表单提交的几种方式:1.最简单的方式 就用form的submit提交方式,这种提交方式是不需要回调函数的   这种方式最近到一个form提供action路径后台接受就可以< ...

  8. 小程序 <web-view></web-view> 中使用 form 表单提交

    在最近的小程序项目中,使用到了 <web-view></web-view> 内嵌 H5 页面,在 H5 中需要使用 form 表单提交数据. H5 使用的技术框架是 vue+v ...

  9. js_ajax模拟form表单提交_多文件上传_支持单个删除

    需求场景: 用一个input type="file"按钮上传多张图片,可多次上传,可单独删除,最后使用ajax模拟form表单提交功能提交到指定方法中: 问题:由于只有一个file ...

随机推荐

  1. 使用MyEclipse设置所需配置的iOS应用

    MyEclipse个人授权 折扣低至冰点!立即开抢>> [MyEclipse最新版下载] 一.iOS应用程序配置要求 这个进程需要四个需求数据文件: 证书签名请求(CSR)文件 证书签名请 ...

  2. UI基础:UIControl及其子类

    UISegmentedControl  UISegmentedControl 是iOS中的分段控件 每个segment 都能被点击,相当于集成了若干个button. 通常我们会点击不同的segment ...

  3. https页面证书验证、加密过程简介

    1.服务器向CA机构获取证书(假设这个证书伪造不了),当浏览器首次请求服务器的时候,服务器返回证书给浏览器.(证书包含:公钥+申请者与颁发者的相关信息+签名) 2.浏览器得到证书后,开始验证证书的相关 ...

  4. 【其他】msb-lsb-intel-motorola大小端问题

    MSB(Most Significant Bit) 最高有效位: LSB(Least Significant Bit) 最低有效位 intel格式:低字节在前 Motorola格式:高字节在前 参考1 ...

  5. Linux博客系统服务器搭建

    linux(CentOS)服务器搭建 前言 拿到购买的服务器信息后,会给出一个服务器的账号的密码,看你自己设置,账号一般为root. 拿到后,可在阿里云官网登录进入服务器.然后就可以进行一下的流程从而 ...

  6. chapter02 K近邻分类器对Iris数据进行分类预测

    寻找与待分类的样本在特征空间中距离最近的K个已知样本作为参考,来帮助进行分类决策. 与其他模型最大的不同在于:该模型没有参数训练过程.无参模型,高计算复杂度和内存消耗. #coding=utf8 # ...

  7. CF1142E/1143B Lynyrd Skynyrd

    CF1142E/1143B Lynyrd Skynyrd 开始读错题了,以为是连续的一段,敲完后才发现是 \(subsequence\) ... 考虑对于 \(a\) 中的每个 \(a_i\) 找到它 ...

  8. BZOJ1095: [ZJOI2007]Hide 捉迷藏【线段树维护括号序列】【思维好题】

    Description 捉迷藏 Jiajia和Wind是一对恩爱的夫妻,并且他们有很多孩子.某天,Jiajia.Wind和孩子们决定在家里玩 捉迷藏游戏.他们的家很大且构造很奇特,由N个屋子和N-1条 ...

  9. Codeforces Round #224 (Div. 2) A. Ksenia and Pan Scales

    A. Ksenia and Pan Scales time limit per test 1 second memory limit per test 256 megabytes input stan ...

  10. ACM中的取模

    取模本身的性质:(之前有一篇博客写过)三则运算(+,-,*)过程中的取模与最后的取模一样(前提是最后不超long long(或int) 范围,所以为防止超范围,直接对三则运算中的过程取模) 然后就是A ...