上传文件的类型；具体做法如下所示：

注意：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. 在CentOS中部署.Net Core2.1网站

    作为一个刚接触linux的新手,在安装环境的时候,折腾了不少时间,写下一篇总结帖,帮助下新人吧~ 做完后再回来看步骤,也很简单,也就以下几步: 1.安装.Net Core环境 2.安装nginx实现端 ...

  2. mysql存储过程调用含out参数

    mysql 数据库有以下存储过程: CREATE DEFINER=`root`@`localhost` PROCEDURE `hovertreeTest`( IN `Param1` INT, ), O ...

  3. Java多线程之wait、notify/notifyAll 详解，用wait 和notifyAll 以及synchronized实现阻塞队列，多线程拓展之ReentrantLock与Condition

    前言:这几天看了很多关于多线程的知识,分享一波.(但是目前接触的项目还未用到过,最多用过线程池,想看线程池 请看我之前的博客) 关于基本的理论等 参考如下: https://www.cnblogs.c ...

  4. python基础学习（二）注释和算术运算符

    注释 1. 注释的作用 注释就是对某些代码进行标注说明,以增强代码的可读性.我们在写程序的时候,编写的某一部分代码的意图不太明显,这时候就需要对这一部分代码加以说明,来明确这一部分到的意图.一般的编程 ...

  5. 异常：android.os.NetworkOnMainThreadException

    场景: 安卓开发时在主线程访问网络解决: 将访问网络的代码使用Thread操作 Handler handler = new Handler(){ @Override public void handl ...

  6. ajax 跨域请求解决方案

    1.为什么出现跨域: 前端和后端同一个项目下,ajax请求的地址是localhost同一个端口是话,是不会出现跨域问题的,所以相反前端和后端分开时,ajax请求的地址或者端口不是跟后台相同时就会出现跨 ...

  7. CSS概念【记录】

    1.CSS语法 2.@规则 3.注释 4.层叠 5.优先级 6.继承 7.值 8.块格式化上下文 9.盒模型 10.层叠上下文 11.可替换元素 12.外边距合并 13.包含块 14.视觉格式化模型 ...

  8. spring-boot-starter-thymeleaf对没有结束符的HTML5标签解析出错

    springboot 在使用thymeleaf 作为模板时,当出现未关闭标签时,如下所示代码,标签没有关闭. <link href="plugin/layui/css/layui.cs ...

  9. meta、link、script的常用写法

    meta 设置编码格式 <meta charset='utf-8'> 设置关键字 <meta name="keywords" content="音乐 播 ...

  10. maven 继承

    一个 maven 项目可以继承另一个 maven 的依赖, 称为子项目 父项目 使用场景: 多个子项目都需要某些依赖, 就可以把子项目共同的依赖抽取到父项目中, 子项目通过继承得到这些依赖, 这样也更 ...