input上传文件检测文件大小
前几天在做 input[type='file'] 上传图片时,需要检测上传文件的内存大小,写了一个小demo,在此做一总结:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>文件上传大小检测</title> </head> <body> <input name="txtName" type="file" multiple accept="image/*" id="pic" onchange="loadImage(this)" /> <script> function loadImage(img) { var filePath = img.value; var fileExt = filePath.substring(filePath.lastIndexOf(".")) .toLowerCase(); if (!checkFileExt(fileExt)) { alert("您上传的文件不是图片,请重新上传!"); img.value = ""; return; } if (img.files && img.files[0]) { // alert(img); // alert(img.files[0]) alert('你选择的文件大小' + (img.files[0].size / 1024).toFixed(0) + "kb"); } else { img.select(); var url = document.selection.createRange().text; try { var fso = new ActiveXObject("Scripting.FileSystemObject"); } catch (e) { alert('如果你用的是ie8以下 请将安全级别调低!'); } alert("文件大小为:" + (fso.GetFile(url).size / 1024).toFixed(0) + "kb"); } } function checkFileExt(ext) { if (!ext.match(/.jpg|.gif|.png|.bmp/i)) { return false; } return true; } </script> </body> </html>
上传文件之后浏览器显示:
之后又发现了其他大牛的全能博客:
https://www.cnblogs.com/tjzhangjianjun/p/5670972.html
https://www.haorooms.com/post/input_file_leixing
分类:
JavaScript
, 知识总结
标签:
input上传文件检测文件大小
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 现代计算机视觉入门之:什么是图片特征编码
· .NET 9 new features-C#13新的锁类型和语义
· Sdcb Chats 技术博客:数据库 ID 选型的曲折之路 - 从 Guid 到自增 ID,再到
· 语音处理 开源项目 EchoSharp
· 《HelloGitHub》第 106 期
· Spring AI + Ollama 实现 deepseek-r1 的API服务和调用
· 使用 Dify + LLM 构建精确任务处理应用