限制文件类型，大小，单个上载在jquery文件上传时不起作用

我正在尝试使用带有Spring MVC的blueimp jquery文件上传插件来上传excel文件。文件正在上传。 我想将文件类型限制为excel（xls，xlxs），也只允许单个文件上传。 我正在使用插件推荐的参数，也尝试添加add: callback来执行validation，它都不起作用。 请帮忙。

我正在使用的js文件（按相同顺序）

 jquery.min.js  jquery.ui.widget.js  jquery.iframe-transport.js  jquery.fileupload.js bootstrap.min.js 

我的HTML代码是

    Select files...    
 
  
 
 
  
 
 
 
File Name
 
File Size
 
File Type
 
Download
 
  

javascript代码是：

 $(function() { 'use strict'; // the location of your server-side upload handler: var url = ''; $('#fileupload') .fileupload( { //this doesnt work add : function(e, data) { var uploadErrors = []; var acceptFileTypes = /(\.|\/)(xls|xlsx)$/i; alert(acceptFileTypes .test(data.originalFiles[0].type)); if (data.originalFiles[0]['type'].length && acceptFileTypes .test(data.originalFiles[0].type)) { uploadErrors .push('Not an accepted file type'); } if (data.originalFiles[0]['size'].length && data.originalFiles[0]['size'] > 5000000) { uploadErrors .push('Filesize is too big'); } if (uploadErrors.length > 0) { alert(uploadErrors.join("\n")); } else { data.submit(); } }, dataType: 'json', maxFileSize : 50000,//this doesnt work acceptFileTypes : /(\.|\/)(xls|xlsx)$/i, //this doesnt work singleFileUploads : true, maxNumberOfFiles : 1, done: function (e, data) { $("tr:has(td)").remove(); $.each(data.result, function (index, file) { $("#uploaded-files").append( $('') .append($('').text(file.fileName)) .append($('').text(file.fileSize)) .append($('').text(file.fileType)) .append($('').html("Click")) )//end $("#uploaded-files").append() }); }, fail : function(e, data) { $ .each( data.messages, function(index, error) { $( '
Upload file error: ' + error + '
') .appendTo( '#files'); }); }, progressall : function(e, data) { var progress = parseInt(data.loaded / data.total * 100, 10); $('#progress .progress-bar').css('width', progress + '%'); } }).prop('disabled', !$.support.fileInput).parent() .addClass($.support.fileInput ? undefined : 'disabled'); }); 

Answer 1

我自己找到了解决方案由于某种原因，以下属性不能用于基本Jquery Blueimp文件上传

 maxFileSize : 50000,//this doesnt work acceptFileTypes : /(\.|\/)(xls|xlsx)$/i, //this doesnt work singleFileUploads : true, maxNumberOfFiles : 1, 

所以我不得不使用我的问题中提到的add: callback，但上面的回调几乎没有变化，我得到了它的工作。这是新的回调：

 add : function(e, data) { var uploadErrors = []; if (!(/(\.|\/)(xls|xlsx)$/i) .test(data.files[0].name)) { uploadErrors .push('Not an accepted file type'); } if (data.files[0].size > 5000000) { uploadErrors .push('Filesize is too big'); } if (uploadErrors.length > 0) { alert(uploadErrors.join("\n")); } else { data.submit(); $('#fileupload').fileupload('disable'); } },