jquery检测上传文件大小示例


Posted in jQuery onApril 26, 2020

本文实例讲述了jquery检测上传文件大小。分享给大家供大家参考,具体如下:

google了很久,基本上都是用 activeX 来实现~至于为什么不行,这个不多说,说一下以下方法:

已经测试通过的浏览器:IE6+,firefox,chrome,其中 firefox 和 chrome 要能支持 HTML5。

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=big5">
  <title>上传</title>
</head>
<body>
  <form action="XXXXXX" method="POST" name="FileForm" enctype="multipart/form-data">
  <div align="center">
    图片:
    <input type="file" name="file1" size="20" id="file1" />
    <input type="button" onclick="checkFile()" /></div>
  </form>
</body>
</html>
<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script>

<script language="JavaScript" type="text/javascript">
  var fileSize = 0; //文件大小
  var SizeLimit = 1024; //上传上限,单位:byte

  function checkFile() {
    var f = document.getElementById("file1");
    //FOR IE
    if ($.browser.msie) {
      var img = new Image();
      img.onload = checkSize;
      img.src = f.value;
    }
    //FOR Firefox,Chrome
    else {
      fileSize = f.files.item(0).size;
      checkSize();
    }
  }

  //检查文件大小
  function checkSize() {
    //FOR IE FIX
    if ($.browser.msie) {
      fileSize = this.fileSize;
    }

    if (fileSize > SizeLimit) {
      alert('文件超过大小');
    } else {
      document.FileForm.submit();
    }
  }
</script>

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
Django1.7+JQuery+Ajax验证用户注册集成小例子
Apr 08 jQuery
Jquery获取radio选中的值
May 05 jQuery
jQuery事件_动力节点Java学院整理
Jul 05 jQuery
详解jquery选择器的原理
Aug 01 jQuery
基于jquery实现多选下拉列表
Aug 02 jQuery
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
jQuery实现table表格checkbox全选的方法分析
Jul 04 jQuery
jQuery实现的自定义轮播图功能详解
Dec 28 jQuery
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
Sep 10 jQuery
js判断复选框是否选中的方法示例【基于jQuery】
Oct 10 jQuery
JS 遍历 json 和 JQuery 遍历json操作完整示例
Nov 11 jQuery
jQuery实现鼠标拖动图片功能
Mar 04 jQuery
jquery实现轮播图特效
Apr 12 #jQuery
用jQuery实现抽奖程序
Apr 12 #jQuery
jquery实现两个div中的元素相互拖动的方法分析
Apr 05 #jQuery
jQuery 图片查看器插件 Viewer.js用法简单示例
Apr 04 #jQuery
jQuery实现鼠标放置名字上显示详细内容气泡提示框效果的方法分析
Apr 04 #jQuery
viewer.js一个强大的基于jQuery的图像查看插件(支持旋转、缩放)
Apr 01 #jQuery
js、jquery实现列表模糊搜索功能过程解析
Mar 27 #jQuery
You might like
一次因composer错误使用引发的问题与解决
2019/03/06 PHP
php ActiveMQ的安装与使用方法图文教程
2020/02/23 PHP
拖动一个HTML元素
2006/12/22 Javascript
jquery imgareaselect 使用利用js与程序结合实现图片剪切
2009/07/30 Javascript
解决js正则匹配换行问题实现代码
2012/12/10 Javascript
jquery删除提示框弹出是否删除对话框
2014/01/07 Javascript
html dom节点操作(获取/修改/添加或删除)
2014/01/23 Javascript
jquery xMarquee实现文字水平无缝滚动效果
2014/04/29 Javascript
KnockoutJs快速入门教程
2016/05/16 Javascript
js简易版购物车功能
2017/06/17 Javascript
Angular弹出模态框的两种方式
2017/10/19 Javascript
AngularJS实现的锚点楼层跳转功能示例
2018/01/02 Javascript
JavaScript简单实现动态改变HTML内容的方法示例
2018/12/25 Javascript
vue实现微信分享链接添加动态参数的方法
2019/04/29 Javascript
vue设置动态请求地址的例子
2019/11/01 Javascript
小程序跨页面交互的作用与方法详解
2020/01/07 Javascript
js滚轮事件 js自定义滚动条的实现
2020/01/18 Javascript
jQuery实现鼠标滑动切换图片
2020/05/27 jQuery
Vue实现多页签组件
2021/01/14 Vue.js
Vue常用API、高级API的相关总结
2021/02/02 Vue.js
[02:38]DOTA2超级联赛专访Loda 认为IG世界最强
2013/05/27 DOTA
python处理cookie详解
2014/02/07 Python
在Django的模型中添加自定义方法的示例
2015/07/21 Python
Python实现 多进程导入CSV数据到 MySQL
2017/02/26 Python
Python+matplotlib实现填充螺旋实例
2018/01/15 Python
Python 矩阵转置的几种方法小结
2019/12/02 Python
python中的逆序遍历实例
2019/12/25 Python
英国手机零售商:Carphone Warehouse
2018/06/06 全球购物
优秀毕业生推荐信
2013/11/02 职场文书
文史专业毕业生自荐信
2013/11/17 职场文书
含预算的公司户外活动方案
2014/08/16 职场文书
2015年女生节活动总结
2015/02/27 职场文书
煤矿安全学习心得体会
2016/01/18 职场文书
祝福语集锦:朋友新店开业祝福语
2019/12/10 职场文书
javascript遍历对象的五种方式实例代码
2021/10/24 Javascript
Axios代理配置及封装响应拦截处理方式
2022/04/07 Vue.js