前端js限制上传文件类型及大小（1）

最新推荐文章于 2024-01-24 14:46:17 发布
最新推荐文章于 2024-01-24 14:46:17 发布
阅读量1.3w 收藏 11
点赞数
分类专栏： js 文章标签： js 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script type="text/javascript"> 
var isIE = /msie/i.test(navigator.userAgent) && !window.opera; 
function fileChange(target,id) { 
var fileSize = 0; 
var filetypes =[".jpg",".png",".rar",".txt",".zip",".doc",".ppt",".xls",".pdf",".docx",".xlsx"]; 
var filepath = target.value; 
var filemaxsize = 1024*2;//2M 
if(filepath){ 
var isnext = false; 
var fileend = filepath.substring(filepath.indexOf(".")); 
if(filetypes && filetypes.length>0){ 
for(var i =0; i<filetypes.length;i++){ 
if(filetypes[i]==fileend){ 
isnext = true; 
break; 
} 
} 
} 
if(!isnext){ 
alert("不接受此文件类型！"); 
target.value =""; 
return false; 
} 
}else{ 
return false; 
} 
if (isIE && !target.files) { 
var filePath = target.value; 
var fileSystem = new ActiveXObject("Scripting.FileSystemObject"); 
if(!fileSystem.FileExists(filePath)){ 
alert("附件不存在，请重新输入！"); 
return false; 
} 
var file = fileSystem.GetFile (filePath); 
fileSize = file.Size; 
} else { 
fileSize = target.files[0].size; 
} 

var size = fileSize / 1024; 
if(size>filemaxsize){ 
alert("附件大小不能大于"+filemaxsize/1024+"M！"); 
target.value =""; 
return false; 
} 
if(size<=0){ 
alert("附件大小不能为0M！"); 
target.value =""; 
return false; 
} 
} 
</script> 
</head> 
<body> 
<input type="file" name="contractFileName" style="width: 500px;" οnchange="fileChange(this);"/> 
</body> 
</html>

ispotu
关注
  • 0
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
SWFUpload多文件上传及文件个数限制的方法
11-22
本文实例讲述了SWFUpload多文件上传及文件个数限制的方法。分享给大家供大家参考，具体如下： SWFUpload是一个基于flash与JavaScript的客户端文件上传组件。 handlers.js文件 完成文件入列队（fileQueued） → 完成选择文件（fileDialogComplete） → 开始上传文件（uploadStart） → 上传处理（uploadProgress） → 上传成功（uploadSuccess） → 上传完成（uploadComplete）  → 列队完成（queueComplete） 如上所示，单选文件顺序执行以上回调函数，需要注意的是选择多个文件，
JavaScript限制上传文件类型的代码
Jenny的专栏
03-10 1365
JavaScript限制上传文件类型的代码 2009-06-28 15:42:56 | 【大 中 小】 好图网图标搜索引擎，提供超过60万的免费图标、PNG图标、ICO图标、ICNS图标、网页图标 .gif .jpg .png 本代码可以在客户端限制用户选择的上传文件类型 要完成此效果需要两个步骤 第一步：把如下代码加入到区域中
前端文件上传识别文件类型的几种方法，快看你是哪个？
最新发布
QD_ANJING的博客
01-24 1594
除了这些之外，我们还可以使用第三方库file-type来实现文件类型检测，这里我们就不再进行 demo 演示了，感兴趣的可以去官方文档中进行查阅。
前端文件上传，文件大小限制
任彦章的博客
01-18 535
前段上传文件，对文件大小进行限制，暂不经过后端
若依 file-upload 标签修改限制上传类型
s757484077的博客
08-03 1591
ruoyi 上传文件默认类型是："doc", "xls", "ppt", "txt", "pdf"
FileUpload控件文件上传、扩容、限制文件类型及上传验证
热门推荐
不明所以
07-30 1万+
首先，文件上传需要使用FileUpload控件，针对于此控件我们来进行一系列的操作。 1、将选中文件上传到目标位置： //获取上传文件的文件名称 string name = FileUpload1.FileName; //将文件名称拼接成为想要的相对路径 string path = "images/" + DateTime.Now.ToStri
前端js限制上传文件类型及大小
piaoyunlive的博客
04-25 2738
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script type="text/javascript"> var isIE = /msie/i.test(navigator.userAgent) ...
javascript实现限制上传文件大小
10-24
主要介绍了javascript实现限制上传文件大小的方法和示例,需要的朋友可以参考下
Javascript读取上传文件内容/类型/字节数
11-29
在网站开发的某些情况下我们需要上传文件到服务器，在这个过程中可能会对文件做一定的限制，比如说文件格式，文件大小等，在一些情况下我们上传文件其实是为了获取其中的内容在前端区域展示，这个时候就不需要将文件...
上传文件jsweb前端（包含文件格式限制）
10-17
内含多种上传方式，有一个特别详细的，对文件格式，文件大小都有限制的，仿制163网盘文件上传的页面。基本所有的文件上传功能都实现了。
【vue3】前端上传图片的格式大小限制和压缩
aDiaoYa_的博客
08-13 2713
上篇文章中研究了如何使用双token机制，在此篇中就暴露了一些问题：当accesstoken过期后，直到拿到最终想要得到的数据，期间需要经历三次请求——第一次请求，拿到accesstoken过期的消息——第二次携带refreshtoken发起请求，刷新了accesstoken——第三次携带新的accesstoken发起请求，拿到数据。在这个过程中会出现如下报错：在测试了一系列的请求之后，发现问题可能是该次请求携带的请求信息过大。因为我们出现问题的请求是前端上传图片到服务端获取图片链接。
如何使用javascript限制文件上传大小
03-27
NULL 博文链接：https://yangwenshuai.iteye.com/blog/1182620
JS判断上传文件的大小类型等限制
03-04
JS判断上传文件的大小类型等限制，配合JSp再上传文件的时候会及时向用户反馈文件是否满足要求，比如说大小和格式限制
如何限制FileUpload上传文件的格式
m0_49526063的博客
12-27 1894
这个需求需要用到一个验证控件RequiredFieldValidator 如何限制FileUpload上传文件的格式前言1.限制上传文件只能为图片格式2.限制上传文件只能为压缩包总结 前言 这两天做项目遇到的一个需求，在这里写出来和大家分享一下。 1.限制上传文件只能为图片格式 前台代码如下（示例）： <asp:RequiredFieldValidator> <asp:RegularExpressionValidator ID="RegularExpressionValidat
前端怎么解决上传文件太大
weixin_42601547的博客
02-11 1832
前端可以通过以下几种方法来解决上传文件太大的问题： 限制文件大小：在前端代码中限制上传文件的大小，如果文件太大，就提示用户选择一个较小的文件。 分块上传：将文件分成多个小块，分别上传，这样即使文件很大，也不会占用太多的内存。 压缩文件：在前端压缩文件，使得文件体积变小，再上传。 后端处理：如果前端无法处理，也可以在后端进行处理，例如将大文件分块存储。 选择具体的解决方案取决于具体的需求...
js 前端验证文件上传格式，限制上传文件大小（兼容各种浏览器）
stwood007的博客
12-14 6182
js 前端验证文件上传格式，js 前端验证上传文件大小，兼容各种浏览器
文件上传限制类型参考
shengjon的博客
03-16 1373
【代码】文件上传限制类型参考。 在上传文件过程中，设计需求上这边总是需要对上传文件进行限制和判断，避免用户的盲操作，导致上传文件类型不对后，无法得到正确的信息，造成不好的体验影响，所以在页面上我们需要对文件类型做判断。
vue3 el-upload 上传附件及预览 限制只能上传一个图片或者pdf格式的文件
jieyucx的博客
12-05 7475
vue3 el-upload 上传附件及预览 限制只能上传一个图片或者pdf格式的文件
使用 JavaScript 限制文件上传大小
我的博客，不一样的自我表达
05-23 387
在本教程中，我们将使用 JavaScript 来限制文件上传的大小。在开发允许用户上传文件的网站时，这有助于管理所需的磁盘空间量，并防止在有人上传占用了所有可用磁盘空间的文件时出现错误。这就是本教程的全部内容，使用您所学的内容，您现在应该能够使用 JavaScript 限制文件上传的大小。如果文件大小大于 2MB，我们会禁用提交按钮并提示用户选择较小的文件。否则，如果文件小于 2MB，则启用提交按钮并显示一条成功消息。如果您运行该脚本，您应该会收到一条警告消息，其中包含所选文件大小（以 MB 为单位）。
js 限制所有文件上传总大小在1G
05-31
要限制所有文件上传总大小在1G，可以使用以下步骤： 1. 在前端，使用 HTML 的 input 标签中的 multiple 和 accept 属性，允许用户选择多个文件，并限定上传的文件类型。 ```html <input type="file" multiple accept=".jpg,.jpeg,.png" /> ``` 2. 在后端，根据上传的文件大小进行限制。可以在服务器端设置上传文件大小的最大值，一旦上传的文件总大小超过了这个值，就拒绝上传文件。在 Node.js 中，可以使用 multer 中间件进行文件上传，并设置文件大小的限制。 ```javascript const express = require('express'); const multer = require('multer'); const app = express(); const upload = multer({ limits: { fileSize: 1024 * 1024 * 1024, // 1G }, }); app.post('/upload', upload.array('files'), (req, res) => { // 处理上传的文件 }); ``` 这样就可以限制所有文件上传总大小在1G了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值