jQuery对象只能使用jQuery对象的属性和方法,JavaScript对象只能使用JavaScript对象的属性和方法;
$('xx')是jQuery对象,$('xx')[0]是将jQuery对象:"$('xx')"转换为JavaScript对象,这样才可以使用JavaScript对象的属性和方法;
HTML5支持multiple属性,即<input type="file">可能会添加multiple属性并赋值:multiple="multiple",即<input type="file" multiple="multiple">,这样一次性可同时上传多张图片,所以获得一张图片的方法就是:$('xx')[0].files[0]
$('xx')[0].files[0].size可获得文件的大小,单位是字节(B),使用$('xx')[0].files[0].size可用于判断文件的大小。
多文件上传时,获取每一个文件的大小:
var addImags =$(input的id).prop('files');
var fileSize=0;
for(var i=0;i<addImags.length;i++){
fileSize=$(addImags)[i].size;
if(fileSize>1048576){
layer.msg("文件过大");
return;
}
}
限制多文件一次上传个数:
var fileList = $(input的id).get(0).files;
if(fileList.length>10){
alert("一次最多上传10个文件!");
return;
}
IE兼容问题:
<script type="text/javascript">
// 判断是否为IE浏览器: /msie/i.test(navigator.userAgent) 为一个简单正则
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
function fileChange(target){
var fileSize = 0;
if (isIE && !target.files) { // IE浏览器
var filePath = target.value; // 获得上传文件的绝对路径
/**
* ActiveXObject 对象为IE和Opera所兼容的JS对象
* 用法:
* var newObj = new ActiveXObject( servername.typename[, location])
* 其中newObj是必选项。返回 ActiveXObject对象 的变量名。
* servername是必选项。提供该对象的应用程序的名称。
* typename是必选项。要创建的对象的类型或类。
* location是可选项。创建该对象的网络服务器的名称。
*\\\\\\\\\\\\\\\\\\\\\\\\\\
* Scripting.FileSystemObject 为 IIS 内置组件,用于操作磁盘、文件夹或文本文件,
* 其中返回的 newObj 方法和属性非常的多
* 如:var file = newObj.CreateTextFile("C: est.txt", true) 第二个参表示目标文件存在时是否覆盖
* file.Write("写入内容"); file.Close();
*/
var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
// GetFile(path) 方法从磁盘获取一个文件并返回。
var file = fileSystem.GetFile(filePath);
fileSize = file.Size; // 文件大小,单位:b
}
else { // 非IE浏览器
fileSize = target.files[0].size;
}
var size = fileSize / 1024 / 1024;
if (size > 1) {
alert("附件不能大于1M");
}
}
</script>