zoukankan      html  css  js  c++  java
  • H5(一):使用formData对象模拟表单

    1. 简要介绍

    • 描述:xmlhttpRequest level2 中增加了对新接口 formData的支持,通过 formData你可以绕过(form input 等 dom元素)创建,来模拟提交表单。
    • 参考文档:https://developer.mozilla.org/zh-CN/docs/Web/API/FormData。

    2. 相关方法

        //新建空formData
        var formData = new FormData();
    
        //基于 form 元素创建formData
        var formData1 = new FormData(form);
    
        //添加字段方法1
        formData.append("name","gaoxiong");
        formData.append("age",20);
        formData.append("family","fengxujiao");
        formData.append("family","baba");
        formData.append("family","mama");
    
        //添加字段方法1,当value为file时,filename默认值为file.filename,当value为blob对象时,filename为"blob"
        formData.append(key,value,filename);
    
    
        //遍历字段
        for( var pair of formData.entries()){
            console.log(pair[0]+","+pair[1]);
        };
    
        //删除字段
        formData.delete("name");
    
        //FormData的get()方法用于返回FormData对象中和指定的键关联的第一个值,如果你想要返回和指定键关联的全部值,那么可以使用getAll()方法。
        formData.get("age");
    
        //获取与key关联的所有value
        formData.getAll("age");
    
        //判断是否含有key
        formData.has(name);
    
        //遍历所有key
        for (var key of formData.keys()) {
               console.log(key);
        }
    
        //重置字段,会将选定的字段先删除,在重新添加(注意与append的区别)
        formData.set("family","gaoxiong");
        for( var pair of formData.entries()){
            console.log(pair[0]+","+pair[1]);
        };
    
        //获取所有values
        for (var key of formData.values()) {
               console.log(key);
        };

        

        

  • 相关阅读:
    P4675 [BalticOI 2016 day1]Park 题解
    AT4432 [ARC103B] Robot Arms 题解
    P4357 [CQOI2016]K 远点对 题解
    P2163 [SHOI2007]园丁的烦恼 题解
    P3157 [CQOI2011]动态逆序对 题解
    bzoj 1568. [JSOI2008]Blue Mary开公司
    P3120 [USACO15FEB]Cow Hopscotch G 题解
    CSP-S 2021 题解
    Maven简介与安装
    java 基本程序设计结构 一
  • 原文地址:https://www.cnblogs.com/noper/p/6131178.html
Copyright © 2011-2022 走看看