zoukankan      html  css  js  c++  java
  • FormData上传文件

    FormData上传文件

    一、创建对象:
    创建一个FormData对象实例
    1、常用的创建

    let formData = new FormData();

    2、vue中的创建

    let formData = new window.FormData();

    3、在表单的基础上创建

    <form id="fromCont" action="" method="post">
        <input type="text" name="content">
        <input type="submit" value="提交">
    </form>
    //根据id获取表单
      var form = $("#fromCont");
    //初始化实例
    var formData = new FormData(form);
    // 获取content内容
    var content= formData.get("content"); 
    //通过append() 方法向对象中添加content键值对
    formData.append("content",content);
    二、操作方法:
    formData里面存储的数据形式,一对key/value组成一条数据,key是唯一的,一个key可能对应多个value。如果是使用表单初始化,每一个表单字段对应一条数据,它们的HTML name属性即为key值,它们value属性对应value值。
    1、获取值
    //通过get(key)/getAll(key)来获取对应的value
    formData.get("value");  

    2、添加数据

    //通过append(key, value)来添加数据,如果指定的key不存在则会新增一条数据,如果key存在,则添加到数据的末尾
    formData.append("key1", "value1");
    formData.append("key2", "value2");
    formData.append("key2", "value3");
    //获取key1
    formData.get("key1");  //返回 "value1"
    formData.get("key2");  //返回 "value2"
    formData.getAll("key2");  //返回 ['value2','value3']

    3、设置、修改数据

    //通过set(key, value)来设置修改数据,如果指定的key不存在则会新增一条,如果存在,则会修改对应的value值。
    formData.append("key1", "value1");
    formData.set("key1", "value2");
    //获取key1
    formData.get("key1");  //返回 "value2"

    4、删除数据

    //通过delete(key),来删除数据
    formData.append("key1", "value1");
    formData.delete("k1");
    //获取key1
    formData.get("key1");  //返回 []

    5、判断数据的存在

    //通过has(key)来判断是否对应的key值,如果有对应的key值就返回true,如果没有则返回false
    formData.append("key1", "value1");
    formData.has("key1"); // true
    formData.has("key2"); // false
     
     
  • 相关阅读:
    OpenCASCADE Chamfer 3D Basics
    OpenCASCADE Chamfer 2D
    .NetCore 连接 Oracle 数据库,直接C# 或者 ORM框架(EFCore、XPO)
    心内科疾病指南
    HttpClient 调用 RestAPI 接口的用法
    在 Blazor 应用中使用 DevExtreme widgets
    2021 最近一次检查甘油三脂,验证苯扎贝特的效果。
    紫鹊界本味湘菜,
    如何Rest接口获取网上的股票数据,有哪些资源?-- 推荐Tushare金融数据
    优秀常用的「资源搜索网站」,收藏
  • 原文地址:https://www.cnblogs.com/yu412/p/12785527.html
Copyright © 2011-2022 走看看