美文网首页
文件下载 *form表单实现*

文件下载 *form表单实现*

作者: 两年半练习程序员 | 来源:发表于2021-12-10 16:19 被阅读0次
/**
 * @function{下载文件}
 * @param {api地址} url
 * @param {请求的参数} params
 * @param {参数深度解析} deep
 */
<script>
  function formSumbit(url, params, method,deep) {
    let id = 'form' + new Date().getTime();
    var form = document.createElement('form');
    params = params || {};
    form.id = id;
    form.style.display = 'none';
    form.action = url;
    form.method = method || 'post';

    document.body.appendChild(form);
    for (var key in params) {
      var value = params[key];
      if (deep) {
            formItemRecursion(value, key, form);
            continue;
      }
      if (Object.prototype.toString.call(value) == '[object Array]') {
        // Array
        if (value.length) {
          for (var i = 0; i < value.length; i++) {
            var val = value[i];
            if (Object.prototype.toString.call(val) == '[object Object]' || Object.prototype.toString.call(val) ==
              '[object Array]') {
              for (var inputName in val) {
                var textarea = document.createElement('textarea');
                textarea.name = key + '[' + i + ']' + '[' + inputName + ']';
                textarea.value = val[inputName];
                form.appendChild(textarea);
              }
            } else {
              var textarea = document.createElement('textarea');
              textarea.name = key + '[' + i + ']';
              textarea.value = value[i];
              form.appendChild(textarea);
            }
          }
        }
      } else if (Object.prototype.toString.call(value) == '[object Object]') {
        // Object
        for (var inputName in value) {
          if (Object.prototype.toString.call(value[inputName]) == '[object Object]' || Object.prototype.toString.call(
              value[inputName]) == '[object Array]') {
            for (var inputName2 in value[inputName]) {
              var textarea = document.createElement('textarea');
              textarea.name = key + '[' + inputName + ']' + '[' + inputName2 + ']';
              textarea.value = value[inputName][inputName2];
              form.appendChild(textarea);
            }
          } else {
            var textarea = document.createElement('textarea');
            textarea.name = key + '[' + inputName + ']';
            textarea.value = value[inputName];
            form.appendChild(textarea);
          }
        }
      } else {
        var textarea = document.createElement('textarea');
        textarea.name = key;
        if (params[key] !== null && params[key] !== undefined) {
          textarea.value = params[key];
          form.appendChild(textarea);
        }
      }
    }
    var $formDom = document.getElementById(id);
    $formDom.submit();
    $formDom.remove();
    return false;
  }
/**
 * 
 * @param {属性值} val 
 * @param {属性名称} key 
 * @param {添加的容器,默认form表单} form 
 * @param {action操作,默认appendChild} action 
 * @returns 
 */
function formItemRecursion(value, key, form, action) {
    action = action || 'appendChild';
    if (Object.prototype.toString.call(value) == '[object Array]') {
        if (value.length) {
            for (var i = 0; i < value.length; i++) {
                var val = value[i];
                formItemRecursion(val,key + '[' + i + ']',form,action)  
            }
        }
    }else if(Object.prototype.toString.call(value) == '[object Object]'){
        for (var inputName in value) {
            formItemRecursion(value[inputName], key + '[' + inputName + ']', form,action);
        }
    } else {//基本类型
        if (value !== null &&value !== undefined) {
                var textarea = document.createElement('textarea');
                textarea.name = key;
                textarea.value = value;
                form[action](textarea);
        }
    }
    return form;
}

  //调用
  formSumbit('http://localhost:65033/api/v2/Budget/DownloadBudgetTemple', {
    text: [1, 2, 3, 4],
    test2: {
      a: [1, 2, 3, 4],
      b: {
        name: 1,
        age: 2
      },
      c:3
    },
    test3:3
  }, 'get')
</script>
image.png

相关文章

网友评论

      本文标题:文件下载 *form表单实现*

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