上传前获取文件大小
在input文件的变化事件中使用AJAX / PHP上传文件之前，有什么办法找出文件的大小？
对于下面的HTML
<input type="file" id="myFile" /> 尝试以下方法：
//binds to onchange event of your input field $('#myFile').bind('change', function() { //this.files[0].size gets the size of your file. alert(this.files[0].size); });
请参阅以下主题：
如何检查与jQuery的文件input大小？
<script type="text/javascript"> function AlertFilesize(){ if(window.ActiveXObject){ var fso = new ActiveXObject("Scripting.FileSystemObject"); var filepath = document.getElementById('fileInput').value; var thefile = fso.getFile(filepath); var sizeinbytes = thefile.size; }else{ var sizeinbytes = document.getElementById('fileInput').files[0].size; } var fSExt = new Array('Bytes', 'KB', 'MB', 'GB'); fSize = sizeinbytes; i=0;while(fSize>900){fSize/=1024;i++;} alert((Math.round(fSize*100)/100)+' '+fSExt[i]); } </script> <input id="fileInput" type="file" onchange="AlertFilesize();" />
在IE和FF上工作
这里有一个简单的例子，在上传之前获取文件的大小。 它使用jQuery来检测内容添加或更改的时间，但是仍然可以在不使用jQuery的情况下获取files[0].size 。
$(document).ready(function() { $('#openFile').on('change', function(evt) { console.log(this.files[0].size); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="upload.php" enctype="multipart/form-data" method="POST" id="uploadform"> <input id="openFile" name="img" type="file" /> </form>
我有同样的问题，似乎我们还没有一个准确的解决scheme。 希望这可以帮助别人。
经过一段时间的探索后，我终于find了答案。 这是我用jQuery获取文件的代码：
var attach_id = "id_of_attachment_file"; var size = $('#'+attach_id)[0].files[0].size; alert(size);
这只是获取文件大小的示例代码。 如果你想做其他的东西，随时更改代码，以满足您的需求。
在所有浏览器上工作的最佳解决scheme;）
function GetFileSize(fileid) { try { var fileSize = 0; //for IE if(checkIE()) {//we could use this $.browser.msie but since it's depracted we'll use this function //before making an object of ActiveXObject, //please make sure ActiveX is enabled in your IE browser var objFSO = new ActiveXObject("Scripting.FileSystemObject"); var filePath = $("#" + fileid)[0].value; var objFile = objFSO.getFile(filePath); var fileSize = objFile.size; //size in kb fileSize = fileSize / 1048576; //size in mb } //for FF, Safari, Opeara and Others else { fileSize = $("#" + fileid)[0].files[0].size //size in kb fileSize = fileSize / 1048576; //size in mb } alert("Uploaded File Size is" + fileSize + "MB"); } catch (e) { alert("Error is :" + e); } }
更新：我们将使用这个函数来检查它是否是IE浏览器
function checkIE() { var ua = window.navigator.userAgent; var msie = ua.indexOf("MSIE "); if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)){ // If Internet Explorer, return version number alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)))); } else { // If another browser, return 0 alert('otherbrowser'); } return false; }
具有HTML5支持的浏览器具有inputtypes的文件属性。 这当然不适用于旧的IE版本。
var inpFiles = document.getElementById('#fileID'); for (var i = 0; i < inpFiles.files.length; ++i) { var size = inpFiles.files.item(i).size; alert("File Size : " + size); }
你需要做一个Ajax HEAD请求来获取文件大小。 与jQuery的是这样的事情
var req = $.ajax({ type: "HEAD", url: yoururl, success: function () { alert("Size is " + request.getResponseHeader("Content-Length")); } });
ucefkh的解决scheme效果最好，但是因为$ .browser在jQuery 1.91中被弃用，不得不更改为使用navigator.userAgent：
function IsFileSizeOk(fileid) { try { var fileSize = 0; //for IE if (navigator.userAgent.match(/msie/i)) { //before making an object of ActiveXObject, //please make sure ActiveX is enabled in your IE browser var objFSO = new ActiveXObject("Scripting.FileSystemObject"); var filePath = $("#" + fileid)[0].value; var objFile = objFSO.getFile(filePath); var fileSize = objFile.size; //size in kb fileSize = fileSize / 1048576; //size in mb } //for FF, Safari, Opeara and Others else { fileSize = $("#" + fileid)[0].files[0].size //size in kb fileSize = fileSize / 1048576; //size in mb } return (fileSize < 2.0); } catch (e) { alert("Error is :" + e); } }
您可以使用PHP文件大小function。 在使用ajax上传期间，请检查文件大小，首先通过向php脚本请求ajax请求来检查文件大小并返回值。
您可以使用HTML5 File API： http ： //www.html5rocks.com/en/tutorials/file/dndfiles/
但是，对于较老的浏览器，您应该始终使用PHP（或您使用的任何其他后端语言）的回退。
就个人而言，我认为Web World的答案是今天最好的，因为HTML标准。 如果您需要支持IE <10，则需要使用某种forms的ActiveX。 我会避免涉及对Scripting.FileSystemObject进行编码的build议，或直接实例化ActiveX。
在这种情况下，我已经成功地使用了第三方JS库，例如可以configuration为使用HTML5 API或Flash / Silverlight控件的plupload来回填不支持这些的浏览器。 Plupload具有客户端API，用于检查在IE <10中工作的文件大小。
请不要使用ActiveX ，因为它会在Internet Explorer中显示一个可怕的警告消息，并吓跑你的用户。
如果任何人想要实现这个检查，他们应该只依赖现代浏览器中可用的FileList对象，并只依赖于旧版浏览器的服务器端检查（ 逐步增强 ）。
function getFileSize(fileInputElement){ if (!fileInputElement.value || typeof fileInputElement.files === 'undefined' || typeof fileInputElement.files[0] === 'undefined' || typeof fileInputElement.files[0].size !== 'number' ) { // File size is undefined. return undefined; } return fileInputElement.files[0].size; }
