html 在线显示文件大小,如何使用我的HTML实现这个最大文件大小脚本？

我已经给出了这个JavaScript脚本来限制文件上传之前的最大文件大小，但我不知道如何用我当前的代码实现它。如何使用我的HTML实现这个最大文件大小脚本？

这里是JavaScript：

function handleFileSelect(evt) {

var files = evt.target.files; // FileList object

// files is a FileList of File objects. List some properties.

var output = [];

for (var i = 0, f; f = files[i]; i++) {

console.log(f.size); /*

}

}

document.getElementById('files').addEventListener('change', handleFileSelect, false);

而我的HTML：

Upload Image

修改后的代码：

Upload Image

function handleFileSelect(evt) {

var files = evt.target.files; // FileList object

var max_size = 5120; // Max file size

// files is a FileList of File objects. List some properties.

var output = [];

for (var i = 0, f; f = files[i]; i++) {

// console.log(f.size);

if(f.size > max_size) { // Check if file size is larger than max_size

alert("Sorry, but the file that you selected is too large. Please upload a file that is no larger than " + max_size + " KB.");

return false;

} // end if

} // end for loop

} // end function

document.getElementById('files').addEventListener('change', handleFileSelect, false);

2012-10-03

neeko

+1

该方法并不完全，它使用'console.log'调试。如果'f.size'的比较值大于某个预定的阈值，那么你可能会通过表单上的'onsubmit'事件返回false。如果由于最终用户禁用JavaScript或执行一些其他魔术而导致大小过大，您仍然应该检查后端。 –