前台文件大小控制，如何实现(ajaxfileupload)

Question

//文件大小控制
jQuery.validator.addMethod("fileSizeCheck", function(value, element) {
var state = false;
$.ajaxFileUpload({
url:'auth/confrimFileSize',
fileElementId:'file1',
dataType: 'text/html',
async:false,
success: function(data,status) {
if(data['status']=='success'){
state = true;
}else{
state = false;
}
}
});

    return state;
}, "文件过大");

提交表单的时候控制文件大小，请求传到后台之后已经可以把判断后的结果返回给前台，但是ajaxfileupload.js不支持同步，导致state始终为false，求各位大神支招，或者提供更好的文件大小控制的解决方案。

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

在jQuery中，我们可以使用$.post方法来发送AJAX请求。然后，在成功接收响应后，我们可以检查状态是否为"success"。如果为"success"，那么我们就将state设置为true；否则，就将其设置为false。这样，我们就可以根据state的值来决定是否继续进行后续的操作。

以下是一个示例：

$(function() {
  $('#myForm').validate({
    rules: {
      // your validation rules here
    },
    messages: {
      // your validation messages here
    }
  });

  $('input[type="file"]').on('change', function(e) {
    e.preventDefault();

    var formData = new FormData();
    var files = $(this).get(0).files[0];

    formData.append('file', files);

    $.ajax({
      type: 'POST',
      url: '/your/endpoint',
      data: formData,
      processData: false,
      contentType: false,
      success: function(response) {
        console.log(response);
        if (response.status === 'success') {
          $('#result').html('<p>Success!</p>');
        } else {
          $('#result').html('<p>Error</p>');
        }
      },
      error: function(xhr, status, error) {
        console.error(error);
      }
    });
  });
});

在这个示例中，我们在输入框的change事件上添加了一个阻止默认行为的方法，以便可以处理文件选择。然后，我们创建一个FormData对象，并将其包含在我们的AJAX请求中。当数据准备好时，我们将它发送到服务器端。服务器端接收到数据后，会调用success回调函数，获取状态并显示相应的消息。如果状态不是"success"，则显示错误消息。