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

注意：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. 【微服务No.1】Consul服务发现在windows下简单使用

    基本介绍: 安装: 下载地址:https://www.consul.io/downloads.html 运行: consul agent -dev 显示这个界面说明已经开启成功. 页面显示: 然后访问 ...

  2. PHP之单例模式

    之前记得有写过PHP的几种这模式.这几天看群里在问单列模式,觉得还是有必要再深入写清楚下..其实单例模式很好理解滴哦 单例模式顾名思义,就是只有一个实例,作为对象的创建模式,单例模式确保某一个类只有一 ...

  3. spring_04bean的生命周期

    一.前言 spring框架中的bean对象生命周期是面试时常考的问题 往往笔试,面试总喜欢问生命周期的问题 二.spring_bean应用上下文生命周期图: 三.生命周期流程(bean应用上下文): ...

  4. overall error

    Overall error is same with total error in math.

  5. 记录使用Redis和nginx 实现一个简单的负载均衡（FB）

    这两年在博客园看了不少大牛的分享,一直打算能写点什么东西. 之前偶然看见一个利用Redis 当作 Session数据宿主的demo,出处我已经找不到了.后来没事看了看nginx相关的东西.其中负载均衡 ...

  6. laravel常见异常解决

    requested URL not found http://stackoverflow.com/questions/21458080/the-requested-url-projectname-us ...

  7. 下载使用前端开发工具sublime，并汉化

    官网:www.sublimetext.com 汉化流程:安装package control 1.打开“https://packagecontrol.io/installation”,先下载“packa ...

  8. 小tips：Hbuilder编辑器开启less自动编译为css的方法

    1.首先,依次打开菜单栏->工具->预编译器设置,打开后是这样的: 2.然后点击新建. 3.文件后缀为.less触发命令地址就是lessc.cmd所在的地址,先用npm全局安装less, ...

  9. BZOJ2946 [Poi2000]公共串(后缀自动机)

    Description          给出几个由小写字母构成的单词,求它们最长的公共子串的长度. 任务: l        读入单词 l        计算最长公共子串的长度 l        输 ...

  10. 如何用ABP框架快速完成项目(9) - 用ABP一个人快速完成项目(5) - 不要执着于设计模式和DDD理论，避免原教旨主义

    为什么要写这节文章呢?   首先主动看我这系列文章和参加活动课程的同学, 肯定是积极好学的. 所以很大概率是学过设计模式和DDD理论的. 很大概率不是走一点都不懂设计模式和DDD理论这个极端, 而是走 ...