form表单上传附件的几种方法

问题描述:在网页开发过程中,当需要上传附件(图片,音频,视频等)时,常规方法是使用form表单进行提交,这里总结一下form表单提交的几种方法。

参考地址:http://www.cnblogs.com/zhuxiaojie/p/4783939.html

1.使用form表单进行提交

<form name="form名称" action="请求地址"  method="请求类型" enctype ="multipart/form-data">
    <input type="file" name="">
    <input type="text" name="">
    <input type="submit" value="提交">
</form>

2.使用FormData对象

function editUserInfo() {
    var formData = new FormData(document.getElementById('editUserInfo'));
    $.ajax({
      url: url,
      type: method,
      data: formData,
      processData: false,
      contentType: false,
      xhrFields: {
        withCredentials: true
      },
      crossDomain: true,
      success: function (obj) {
        // ...
      },
      error: function (obj) {
        // alert('服务器请求失败');
      }
    })
  }

3.使用jquery.form.js

  • jquery.form.js是一个强大的表单插件,其大量的提供了表单操作的各种简便的方法
  • 前提先引入jquery.form.js插件
  • 详细信息请参考http://jquery.malsup.com/form/
// ajaxSubmit提交form表单
  function updateUserInfo() {
    $('#表单ID').ajaxSubmit({
      url: url,
      type: 'POST',
      //data: $('表单ID').serialize(),
      //processData: false,
      //contentType: false,
      xhrFields: {
        withCredentials: true
      },
      crossDomain: true,
      success: function (obj) {
        // ...
      },
      error: function (obj) {
        // alert('服务器请求失败');
      }
    });
  }
posted @ 2018-08-14 14:55  星朝  阅读(6303)  评论(0编辑  收藏  举报