美文网首页
[js]FormData对象的作用及用法

[js]FormData对象的作用及用法

作者: 泉落云生 | 来源:发表于2018-07-26 19:59 被阅读32次

    一、作用

    1.用一些键值对来模拟一系列表单控件:即把form中所有表单元素的name与value组装成
    一个queryString。

    1. 异步上传二进制文件。

    二、使用

    FormDataPrototype.png
    let form = new FormData();
    form.append('name','value')//添加 name:value
    form.get('name')//获取value
    form.append('name','zhangsan')添加
    form.getAll('name')//array获取所有
    form.set('name','logger')//设置
    form.getAll('name')//logger
    form.has('name')//true
    form.delete('name')
    form.has('name')//false
    

    jq实践

    var selectedFile = $('#input').get(0).files[0];
    $('#choose option:selected').val()
    var params = new FormData();
    params.append('id',$('#pop').attr('data-id'));
    params.append('status',$('input[name="status"]:checked').val());
    params.append('remark',$('textarea[name="remark"]').val());
    params.append('invoiceImage',$('#upfile').get(0).files[0]) //文件
    $.ajax({
        url:'/staff/fee/invoice/update',
        data:obj,
        type:'post',
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        success:function(res){
            if(res.errCode == 0){
                tipshow('提交成功')
                layer.closeAll();
                location.reload()
            }else{
                tipshow(res.errMsg,'warn')
            }
        }
    })
    

    相关文章

      网友评论

          本文标题:[js]FormData对象的作用及用法

          本文链接:https://www.haomeiwen.com/subject/cpedmftx.html