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 ...
随机推荐
- 启动tomcat后struts框架报异常严重: Exception starting filter struts2 Unable to load configuration.
启动tomcat后struts框架报异常严重: Exception starting filter struts2 Unable to load configuration. 出现此异常是因为,str ...
- 使用sublime时报编码错误
在执行Python脚本时报如下错误: UnicodeEncodeError: 'ascii' codec can't encode characters in position 0-78: ordin ...
- STL中的查找算法
STL中有很多算法,这些算法可以用到一个或多个STL容器(因为STL的一个设计思想是将算法和容器进行分离),也可以用到非容器序列比如数组中.众多算法中,查找算法是应用最为普遍的一类. 单个元素查找 1 ...
- 在centos6.5中安装github的客户端git
简介 git是一个分布式版本控制软件,我采用的采用的安装方式是源码安装 1.安装编译git时需要的包 # yum install curl-devel expat-devel gettext-deve ...
- AxureRP8实战手册(基础1-10)
基础操作篇 本篇包含56种常见的基础操作,初学者应在掌握本篇内容后再进行实战案例篇的学习,以免产生学习障碍.同时,建议具备一定基础的读者学习本篇中相对生疏的内容,并加以掌握. 第1章 使用元件 本文目 ...
- openwrt 的依赖找不到问题
Openwrt报告库找不到Package * is missing dependencies for the following libraries: libc.so.6 或其他先检查系统里面有没有这 ...
- CentOS7 安装RabbitMQ
第一.下载erlang和rabbitmq-server的rpm: http://www.rabbitmq.com/releases/erlang/erlang-19.0.4-1.el7.centos. ...
- Java Integer的底层优化
看一个程序(腾讯题) public class showMain { public static void main(String[] args){ //Double i1=127.00,i2=127 ...
- Android 之 log
android.util.Log常用方法: Log.v() VERBOSE 任何消息都会输出 Log.d() DEBUG 仅输出debug调试的意思,但他会输出上层的信息,过滤起来可以通过DD ...
- UISlider
UISlider是iOS中的滑块控件 通常⽤于控制视频播放进度,控制⾳量等. 它继承于UIControl,滑块提供了⼀系列连续的值,滑块停 在不同的位置,获取到滑块上的值也不同. minimumV ...