兼容各浏览器的js判断上传文件大小


由于项目需要,在网上找了一个JS判断上传文件大小的程序,经测试兼容IE6-9,Firefox10,Opera11.6,safari5.1,chrome17

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>js判断上传文件的大小</title>
<script type="text/javascript">
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
var sizeLabel = ["B", "KB", "MB", "GB"];
function fileChange(target) {
var fileSize = 0;
if (isIE && !target.files) {
var filePath = target.value;
var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
var file = fileSystem.GetFile (filePath);
fileSize = file.Size;
} else {
fileSize = target.files[0].size;
}
displayFileSize(fileSize);
}

function displayFileSize(size) {
var fileSize = document.getElementById("fileSize");
fileSize.innerHTML = calFileSize(size);
}

function calFileSize(size) {
for (var index = 0; index < sizeLabel.length; index++) {
if (size < 1024) {
return round(size, 2) + sizeLabel[index];
}
size = size / 1024;
}
return round(size, 2) + sizeLabel[index];
}

function round(number, count) {
return Math.round(number * Math.pow(10, count)) / Math.pow(10, count);
}
</script>
</head>
<body>
<div>
<input type="file" onchange="fileChange(this);">
</div>
<div id="fileSize">
</div>
</body>
</html>

兼容各浏览器的js判断上传文件大小

时间: 2024-10-12 17:40:20

兼容各浏览器的js判断上传文件大小的相关文章

js判断上传文件大小

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="content-typ

js检测上传文件大小

前言: 项目中经常用到需要上传文件.照片等功能,同时需要限制所上传文件的大小.很多插件都会采用后台请求验证,前端Js校验比较少.本篇介绍一个前端JS便捷判断上传文件大小的方法. 代码很简单,关键就是怎么用JS拿到文件然后获取文件大小,进而去判断拦截.由于各种历史原因,IE的ActiveX控件因素,获取文件的方法可能和其他浏览器有所不同,所以只需稍加判断即可. JS代码: <script type="text/javascript"> // 判断是否为IE浏览器: /msie

JS判断上传文件类型

/*   * 判断图片类型   */    function checkImgType(ths){        if (ths.value == "") {            alert("请上传图片");            return false;        } else {            if (!/\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/.test(ths.value)) {                a

js判断上传文件的大小,及确认文件是否在本地存在,兼容firefox、chrome、ie等浏览器

<pre name="code" class="javascript">上传图片文件的html标签 <input name="file" type="file" id="<span style="color:#ff0000;">file</span>" accept="image/gif,image/jpeg,image/png&quo

js 判断上传文件的大小

原先加了一个qq群,群里有人问道有没有办法在浏览器端获得上传文件的大小并做出限制,我自己并不知道方法,我觉得是不可以的,我在群里提出自己的见解的同时也向别人提出如果就解决办法也想一起知道,直到一大神出现解决了这个问题,才明白解决办法,忽然觉得这群里还是能学到新东西的!废话不多说了. 这是js判断文件大小的方法. function CheckImage(FileUpload) { var isIE = /msie/i.test(navigator.userAgent) && !window.

兼容IE浏览器样式的html上传文件控件

最近在公司做项目时需要用到html的上传文件控件,但发现原生的上传文件控件<input type="file" />在IE.Chrome浏览器的显示效果相差很大,为了统一样式,我参考了网上的许多方法,下面给出我自己的代码实现(实际上就是在原生的input file上面加个外壳,再添加一些样式,让它看上去不像原生的这么丑) html部分 <div class="upload-box"> <div class="input&quo

JS兼容各个浏览器的本地图片上传即时预览效果

很早以前 在杭州银行工作曾经碰到这么一个需求,当时也是纠结了很久,也是google了很久,没有碰到合适的demo,今天特意研究了下这方面的的问题,所以也就做了个简单的demo来实现 本地上传图片即时预览效果.其在标准浏览器(firefox,chrome,IE10等其他浏览器)用了HTML5中的内容实现图片即时预览效果.在IE10以下浏览器用了滤镜来解决图片显示问题.在看代码之前,先让我们来了解以下知识点: HTML5中的FileReader对象: FileReader对象主要是把文件读入内存中,

javascript判断上传文件大小

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta h

js jquery 上传文件格式大小判断简单总结

大家好我是床前明月光,疑是地上霜 // html <a href="javascript:;" class="file">添加附件 <input type="file" name="" id="fileId" onchange="upload()"></a> /**判断上传文件文件格式**/var filePath ="";var