js判断文件类型大小并给出提示
上传文件是工作中常用的功能,不同的场景对不同的文件类型和文件大小都有不同的要求:
<form id="uploadForm" method="post" class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">名称</label>
<div class="layui-input-block">
<input type="text" name="name" required lay-verify="required"
placeholder="请输入文件名" autocomplete="off" class="layui-input">
</div>
</div> <div class="layui-form-item">
<label class="layui-form-label">资料类型:</label>
<div class="layui-input-block">
<select name="datatypeid" id="datatypeid"></select>
</div>
<input type="hidden" id="yincang">
</div>
<div class="layui-form-item">
<label class="layui-form-label">上传文件</label> <div class="layui-input-block">
<input class="layui-input" type="file" name="file" onchange="fileChange(this);"/>
</div>
</div> <div class="layui-form-item">
<div class="layui-input-block"> <input type="button" class="layui-btn" value="上传"
onclick="upload()" />
</div>
</div>
</form>
js方法:
<script type="text/javascript">
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
function fileChange(target, id) {
var fileSize = 0;
var filetypes = [ ".doc", ".docx" ];//这里设置接受的文件类型
var filepath = target.value;
var filemaxsize = 1024 * 10;//接受的文件最大10M
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>
js判断文件类型大小并给出提示的更多相关文章
- [转]客户端js判断文件类型和文件大小即限制上传大小
原文地址:https://www.jb51.net/article/43498.htm 需要脚本在客户端判断大小和文件类型,由于网上没有适合的,就自己写了一个并测试 文件上传大小限制的一个例子,在此与 ...
- 客户端js判断文件类型和文件大小即限制上传大小
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- Linux中用st_mode判断文件类型
Linux中用st_mode判断文件类型 2012-12-11 12:41 14214人阅读 评论(4) 收藏 举报 分类: Linux(8) C/C++(20) 版权声明:本文为博主原创文章, ...
- Python之基于十六进制判断文件类型
核心代码: #!/usr/bin/env python # -*- coding: utf-8 -*- # @Author : suk import struct from io import Byt ...
- JavaScript根据文件名判断文件类型
//JavaScript根据文件名判断文件类型 var imgExt = new Array(".png",".jpg",".jpeg",& ...
- js判断浏览器类型 js判断ie6不执行
js判断浏览器类型 $.browser 对象 $.browser.version 浏览器版本 var binfo = ''; if ($.browser.msie) { binfo = " ...
- PHP取二进制文件头快速判断文件类型
<?php /*文件扩展名说明 *7173 gif *255216 jpg *13780 png *6677 bmp *239187 txt,aspx,asp,sql *208207 xls.d ...
- 通过JS判断联网类型和连接状态
通过JS判断联网类型和连接状态 中国的移动网络环境复杂,为了给用户带去更好访问体验,开发者希望能了解用户当前的联网方式,然后给用户一个符合当前网络环境的请求结果. W3C的规范中给出了一个方法来获得现 ...
- 用java流方式判断文件类型
这个方法只能在有限的范围内有效.并不是万金油 比如 图片类型判断,音频文件格式判断,视频文件格式判断等这种肯定是2进制且专业性很强的文件类型判断. 下面给出完整版代码 首先是文件类型枚取 packag ...
随机推荐
- 深入浅出Java动态代理
文章首发于[博客园-陈树义],点击跳转到原文深入浅出Java动态代理 代理模式是设计模式中非常重要的一种类型,而设计模式又是编程中非常重要的知识点,特别是在业务系统的重构中,更是有举足轻重的地位.代理 ...
- Office隐藏17年的漏洞CVE_2017_11882测试记录
Office隐藏17年的漏洞CVE_2017_11882测试记录 创建时间: 2017/11/25 0:18 作者: CN_Simo 标签: Office漏洞 参考文章1:https://www.cn ...
- C#winform程序安装在默认路径提示权限不足的问题
这个需要以管理员身份运行即可.在program.cs里面修改即可也可以在别的地方,如:C# 编程中可以使程序自动使用管理员身份运行,也就是我们常常看到一些程序的图标上会冒出个盾牌.方法:在源码的Pro ...
- [面试没答上的问题1]http请求,请求头和响应头都有什么信息?
最近在找工作,面试官问了一些问题自己并没有回答上,这里做一个小结. http请求,请求头和响应头都有什么信息? 页面和服务器交互最常见的方式就是ajax,ajax简单来说是浏览器发送请求到服务端,然后 ...
- leetcode#42 Trapping rain water的五种解法详解
leetcode#42 Trapping rain water 这道题十分有意思,可以用很多方法做出来,每种方法的思想都值得让人细细体会. 42. Trapping Rain WaterGiven n ...
- MySQL .msi 安装失败改用.zip安装步骤
一开始官网下载.msi安装包,安装到配置server时无法启动,长时间卡在这里,无法继续下去.上网看了一下解决办法,发现用.zip安装包进行安装比较简单可靠. 一.利用.msi安装包安装失败后的处理 ...
- 【C#入门教案-02】用记事本编写第一个C#程序-Hello World
02-用记事本编写第一个C#程序-Hello World 广东职业技术学院 欧浩源 [1]进行.NET程序开发的最基本环境配备 .NET Framework + 代码编辑工具(记事本或Noetpad ...
- 【转】如何使用Git上传本地项目到github?(mac版)
原文链接:http://www.cnblogs.com/lijiayi/p/pushtogithub.html 在此假设你已经在 github 上创建好了一个项目,像这样: 并且你已经完成了自己的项目 ...
- 深入理解php底层:php生命周期
1.PHP的运行模式: PHP两种运行模式是WEB模式.CLI模式.无论哪种模式,PHP工作原理都是一样的,作为一种SAPI运行. 1.当我们在终端敲入php这个命令的时候,它使用的是CLI. 它就像 ...
- velocity 是如何实现内省 屏蔽反射的
velocity的标签中支持$abc 这样的语法,如果abc是一个对象,则写模板时就可以利用它来进行反射,调用一些危险的方法,如 $vm.getClass().newInstance() #set ( ...