表单相关-文件上传-下载-异步/同步提交

1.jquery 异步提交的二次封装：

var base = "http://127.0.0.1/project/sys";
function handlerData(obj, callbackHandler) {
  $.ajax({
    url: base + obj.url,
    data: obj.data,
    async: obj.async,
    dataType: obj.dataType,
    type: obj.type,
    timeout: 10000,
    success: function(data, type, xhr) {
      if (xhr.status >= 200 && xhr.status < 400) {
        callbackHandler(data, xhr);
      } else {
        console.log(xhr.status);
      }
    },
    error: function(xhr, type, errorThrown) {

　　if (xhr.status === 0) { alert("网络断开，请连接网络！！！"); } } }); }

// 调用
  handlerData(
    {
      url: "/count",
      data: {},
      async: true,
      dataType: "JSON",
      type: "GET"
    },
    function(data, xhr) {
      $("current-time").text(data);
    }
  );

　　

2. 上传文件

由于本地上传给后台的是文件流，而不是一个本地地址，所以和普通的上传不一样

首先要添加enctype属性的form元素上：	<form class="postFilesForm" enctype="multipart/form-data">
其次：

　　var formD = new FormData($(".postFilesForm")[0]);   //fromData也是对文件的处理，此外serializeArray()方法也可以获取到form的值，不过未经处理，并且文件不能上传成功，因为值只是一个路径，对后台来说，无效

  $.ajax({
    url: "http://127.0.0.1/project/sys/text/",
    data: formD,
    async: false,
    dataType: "JSON",
    type: "POST",
    timeout: 10000,
    cache: false,
    processData: false,
    contentType: false,
    success: function(data, type, xhr) {
      if (xhr.status >= 200 && xhr.status < 400) {
        console.log(data);
        window.location.reload();
      } else {
        console.log(xhr.status);
      }
    },
    error: function(xhr, type, errorThrown) {
      if (xhr.status === 0) {
        alert("网络断开，请连接网络！！！");
      }
    }
  });

　　

　　3.后台返回的如果是文件流（一堆乱码），则无需用ajax, 直接将连接添加到a标签上（如果是按钮，则在按钮内部添加a标签）