input file上传文件扩展名限制
方法一(不推荐使用):用jS获获取扩展名进行验证:
<script type="text/javascript" charset="utf-8">
function change(e){
var src=e.target || window.event.srcElement; //获取事件源，兼容chrome/IE
src.style.background='red';
alert( src.value );
//测试chrome浏览器、IE6，获取的文件名带有文件的path路径
//下面把路径截取为文件名
var filename=src.value;
alert( filename.substring( filename.lastIndexOf('\\')+1 ) );
//获取文件名的后缀名（文件格式）
alert( filename.substring( filename.lastIndexOf('.')+1 ) );
}
</script>
</head>
<body >
选择文件:
<br>
<input type='file' onchange="change(event);" >
</body>
方法二(好方法):
HTML <input> 标签的 accept 属性
实例
在文件上传中使用 accept 属性，本例中的输入字段可以接受 GIF 和 JPEG 两种图像：(上传选择文件时候,只显示这两种文件)
<form>
<input type="file" name="pic" id="pic"accept="image/gif, image/jpeg"/>
</form>
如果不限制图像的格式，可以写为：accept="image/*"。
定义和用法
accept 属性只能与 <input type="file"> 配合使用。它规定能够通过文件上传进行提交的文件类型。
提示：请避免使用该属性。应该在服务器端验证文件上传。
http://www.w3school.com.cn/tags/att_input_accept.asp
input file上传文件扩展名限制的更多相关文章
- ajax+ashx 完美实现input file上传文件
1.input file 样式不能满足需求 <input type="file" value="浏览" /> IE8效果图: Firefox效 ...
- 在HTML5的 input:file 上传文件类型控制 遇到的问题
1.input:file 属性的介绍 先瞅代码吧 <form> <input type="file" name="pic" accept=& ...
- input file 上传文件
面试的时候遇到一个问题,要求手写的方式上传文件. 本来觉得很简单,但是结果怎么也成功不了. 前台: <form ID="form1" action="AcceptF ...
- input file上传文件
如何使用input[type='file']来上传文件呢? html: //angular<input type="file" (change)="fileChan ...
- 巧妙利用label标签实现input file上传文件自定义样式
提到上传文件,一般会想到用input file属性来实现,简单便捷,一行代码即可 但input file原生提供的默认样式大多情况下都不符合需求,且在不同浏览器上呈现的样式也不尽相同 我们往 ...
- 使用input file上传文件中onChange事件只触发一次问题
每次上传文件的时候,都会将当前的文件路径保存至$event.target.value中,当第二次选择文件时,由于两次$event.target.value相同,所以不会触发change事件. 解决方案 ...
- file 上传文件后缀名 限制
比如: 要求只能上传Excel <input type="file" accept="application/vnd.ms-excel,application/vn ...
- input file上传文件弹出框的默认格式设置
我们使用html的input 标签type="flie"时,如何设置默认可选的文件格式 <input id="doc_file" type="f ...
- input:file上传文件类型(记录)
imput 属性有以下几种: 1.type:input类型这就不多说了2.accept:表示可以选择的文件类型,多个类型用英文逗号分开,常用的类型见下表. <input id="fil ...
随机推荐
- Flyweight
1 意图:运用共享技术有效地大量支持细粒度的对象 2 动机:flyweight是一个共享对象,可以在多个场景使用. 分为内部状态和外部状态,内部状态存储于flyweight中,包含了独立于flywei ...
- jqGrid表格控件
一. jqGrid的加载. 1.引用相关头文件 引入CSS: <link type="text/css" rel="stylesheet" href=&q ...
- SPSS数据分析—描述性统计分析
描述性统计分析是针对数据本身而言,用统计学指标描述其特征的分析方法,这种描述看似简单,实际上却是很多高级分析的基础工作,很多高级分析方法对于数据都有一定的假设和适用条件,这些都可以通过描述性统计分析加 ...
- codeforces 725D . Contest Balloons(贪心+优先队列)
题目链接:codeforces 725D . Contest Balloons 先按气球数从大到小排序求出初始名次,并把名次排在第一队前面的队放入优先队列,按w-t-1值从小到大优先,然后依次给气球给 ...
- Spring配置中的classpath和classpath*的区别
初学SSH框架,昨天在配置Spring的时候,提示我找不到Spring.xml文件,后面百度之后把classpath改成classpath* 就好了,下面是了解到的简单区别. classpath:只会 ...
- vs2013 遇到的web性能记录器无法使用问题
诊断和修复Web测试记录栏的问题.自2005年以来VSTS运也出现了各种由客户多年来提出不同的问题.记录Web测试时,这在一定程度经常提到的一个话题是一个残疾或不存在的Web测试记录吧.因为它可以令人 ...
- Git基本命令行操作 （转）
Git远程操作详解 作者: 阮一峰 Git是目前最流行的版本管理系统,学会Git几乎成了开发者的必备技能. Git有很多优势,其中之一就是远程操作非常简便.本文详细介绍5个Git命令,它们的概念和 ...
- Objective C类方法load和initialize的区别
Objective C类方法load和initialize的区别 过去两个星期里,为了完成一个工作,接触到了NSObject中非常特别的两个类方法(Class Method).它们的特别之处,在于 ...
- Python OpenCV —— Modifying
一些索引和修改图像像素点数据等的操作,可打印观察运行结果. # -*- coding: utf-8 -*- """ Created on Wed Sep 28 00:11 ...
- BZOJ 1969 树链剖分+Tarjan缩点
发现自己Tarjan的板子有错误.发现可以用Map直接删去边,Get. 听说std是双连通.LCA.并查集.离线思想.用BIT维护dfs序和并查集维护LCA的动态缩点的好题 #include < ...