上传文件的类型;具体做法如下所示:

注意:accept属性可以限制上传格式,其有兼容性如下

《1》上传.csv格式的

<input text="file" accept=".csv" />

《2》上传.xls格式

<input text="file"  accept="application/vnd.ms-excel"/>

《3》上传.xslx格式

<input text="fiel" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"/>

《4》上传.png/.jpg/etc格式

<input type="file" accept="text/plain" />

《5》上传图片格式

<input type="file" accept="image/*" />

《6》上传.htm,.html格式

<input type="file" accept="text/html" />

《7》上传video(.avi, .mpg, .mpeg, .mp4)格式

<input type="file" accept="video/*" />

《8》上传audio(.mp3, .wav, etc)格式

<input type="file" accept="audio/*" />

《9》上传.pdf格式

<input type="file" accept=".pdf" />

《10》如果限制两种文件格式,同时限制

<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel">

注意:以逗号分隔开

input accept属性限制文件上传格式的更多相关文章

  1. input file美化,文件上传

    此文学习至:http://www.haorooms.com/post/input_file_leixing 然而只会用,不会做,UI泪茫茫 效果图: 原图: 美化后: 此主要用css美化表单,然后用J ...

  2. h5 input file ajax实现文件上传

    <input type="file" accept="image/*" height="0" class="file_inp ...

  3. struts2视频学习笔记 15-17 (访问或添加request属性,文件上传)

    课时15 访问或添加request/session/application属性 1.简单说 page指当前页面.在一个jsp页面里有效 2.request 指从http请求到服务器处理结束,返回响应的 ...

  4. input标签处理多文件上传

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  5. jquery的input:type=file实现文件上传

    <!DOCTYPE html> <html> <head> <title>html5_2.html</title> <style> ...

  6. input标签前台实现文件上传

    值得注意的是:当一个表单里面包含这个上传元素的时候,表单的enctype必须指定为multipart/form-data,method必须指定为post,浏览器才会认识并正确执行.但是还有一点,浏览器 ...

  7. html 文件上传框 input标签

    文件上传框 有时候,需要用户上传自己的文件,文件上传框看上去和其它 文本域差不多,只是它还包含了一个浏览按钮.访问者可以通 过输入需要上传的文件的路径或者点击浏览按钮选择需要上传 的文件. 代码格式: ...

  8. input file实现多选和限制文件上传类型

    <!-- input file  accept 属性设置可上传文件的类型  multiple属性设置可多文件上传--> <!-- accept 并未真正的实现限制上传文件类型,只是在 ...

  9. Bootstrap文件上传插件File Input的使用

    基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用 Bootstrap文件上传插件File Input是一个不错的文件上传控件, ...

随机推荐

  1. [转]node-sass 安装失败的各种坑

    本文转自:https://blog.csdn.net/weixin_42406046/article/details/80604623?tdsourcetag=s_pctim_aiomsg 版权声明: ...

  2. 操作数据库出现InvalidOpertionException(内部连接致命错误)

    用DataTables时并发访问量较大,单个任务操作(获取数据)时间较长.连接数过多的时候就出现InvalidOpertionException错误.知道哪里有问题那就好办了,对GetDataTabl ...

  3. MyEclipse中jsp编码设置

    window->preference->Myeclipse->files and editors->jsp,设置编码为utf-8 2.window->preference ...

  4. 【Java每日一题】20170324

    20170323问题解析请点击今日问题下方的“[Java每日一题]20170324”查看(问题解析在公众号首发,公众号ID:weknow619) package Mar2017; public cla ...

  5. Windows驱动匹配详解

    在Windows下,几乎所有的硬件设备都需要安装驱动后才能正常工作,我们重装系统后第一件事就是要为各设备安装好驱动,我们可以下载官方驱动手动安装,也可以让我Windows自动扫描安装,还可以使用驱动精 ...

  6. js发送邮件确定email地址

    <a href="mailto:wjl@tom.com?subject=aaa&body=11111">test</a>

  7. 9;XHTML 多媒体

    1.FLASH 动画的插入 2.MP3 及 WMV 视频的插入 3.网络流媒体视频的插入 使用 Web 如此流行的原因之一是可以再网页上加入图像.声音.动画和电影文件.虽然 过去对这些文件大小的限制局 ...

  8. 魔幻般冒泡背景的CSS3按钮动画

    这是一款非常有特点的CSS3按钮,按钮的背景不是北京图片,也不是单纯的颜色,而是一组魔幻般的冒泡背景动画.当我们将鼠标滑过按钮时,按钮的冒泡背景动画就可以展示出来.可以说这款CSS3按钮的设计风格相当 ...

  9. CA 工作流程

    散列函数 Hash 常见的有 MD5, SHA1, SHA256, 该类函数特点是函数单向不可逆,对输入非常敏感,输出长度固定,针对数据的任何修改都会改变散列函数的结果,用于防止信息篡改并验证数据的完 ...

  10. HDU 3032 Nim or not Nim?(Multi-Nim)

    Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submission( ...