上传前获取文件大小

For the HTML bellow

<input type="file" id="myFile" />

try the following:

//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);


});

See following thread:

How to check file input size with jQuery?

You can use PHP filesize function. During upload using ajax, please check the filesize first by making a request an ajax request to php script that checks the filesize and return the value.

you need to do an ajax HEAD request to get the filesize. with jquery it's something like this

  var req = $.ajax({
type: "HEAD",
url: yoururl,
success: function () {
alert("Size is " + request.getResponseHeader("Content-Length"));
}
});

You can by using HTML5 File API: http://www.html5rocks.com/en/tutorials/file/dndfiles/

However you should always have a fallback for PHP (or any other backend language you use) for older browsers.

<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();" />

Work on IE and FF

I had the same problem and seems like we haven't had an accurate solution. Hope this can help other people.

After take time exploring around, I finally found the answer. This is my code to get file attach with jQuery:

var attach_id = "id_of_attachment_file";
var size = $('#'+attach_id)[0].files[0].size;
alert(size);

This is just the example code for getting the file size. If you want do other stuffs, feel free to change the code to satisfy your needs.

Best solution working on all browsers ;)

function GetFileSize(fileid) {
try {
var fileSize = 0;
// for IE
if(checkIE()) { //we could use this $.browser.msie but since it's deprecated, 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 b
fileSize = fileSize / 1048576; //size in mb
}
// for FF, Safari, Opeara and Others
else {
fileSize = $("#" + fileid)[0].files[0].size //size in b
fileSize = fileSize / 1048576; //size in mb
}
alert("Uploaded File Size is" + fileSize + "MB");
}
catch (e) {
alert("Error is :" + e);
}
}

from http://www.dotnet-tricks.com/Tutorial/jquery/HHLN180712-Get-file-size-before-upload-using-jquery.html

We'll use this function to check if it's IE browser or not

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;
}