如果你不希望用户上传任何类型的文件, 你可以使用 input 的 accept 属性.

设置支持 .doc / .docx / .xls / .xlsx / .pdf 格式:

 <input type="file" accept=".doc,.docx,.xls,.xlsx,.pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" >

如果需要支持 .png  等,则在 accept 添加上既可,都逗号分隔。

 

扩展知识:

accept 属性接受一个逗号分隔的 MIME 类型字符串, 如:

  • accept="image/png" or accept=".png" — 只接受 png 图片.
  • accept="image/png, image/jpeg" or accept=".png, .jpg, .jpeg" — PNG/JPEG 文件.
  • accept="image/*" — 接受任何图片文件类型.
  • accept=".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" — 接受任何 MS Doc 文件类型.

<input> type 类型为 file 的 input 元素使得用户可以选择一个或多个元素以提交表单的方式上传到服务器上,或者通过 Javascript 的 File API 对文件进行操作

<input type="file"> accept属性筛选文件类型的更多相关文章

  1. input type='file'限制上传文件类型

    前端与后台数据进行对接时,就避免不了要使用ajax进行http请求,常用的请求就两个post与get:然而常见的post请求的需求是文件上传,可能我一说到文件上传大家都觉得so  easy啊,没什么嘛 ...

  2. input type=file accept中可以限制的文件类型

    在上传文件的时候,需要限制指定的文件类型. <input type="file" accept="image/*" /> accept表示可以上传文 ...

  3. input type="file" accept="image/*"上传文件慢的问题解决办法

    相信大家都写过<input type="file" name="file" class="element" accept=" ...

  4. html input file accept 上传文件类型限制格式 MIME 类型列表

    例: <input type="file" accept="application/vnd.openxmlformats-officedocument.spread ...

  5. input type=file accept中文件格式限制

    原文链接:https://blog.csdn.net/usuallyuser/article/details/83060341 accept="application/msexcel,app ...

  6. python+selenium:解决上传文件<input type='file'>标签属性被css的visibility隐藏导致无法定位元素的问题

    要想上传文件,需要找到在HTML中<input type="file" />这个标签,有它就可以利用send_keys上传文件,不过这里的<input>元素 ...

  7. input[type='file']获取上传文件路径案例

    最近在项目时,需要获取用户的上传文件的路径,便写了一个demo: <body> <input type="file" name="" valu ...

  8. jQuery 在IE下对表单中input type="file"的属性值清除

    对一个文件域(input type=file)使用了验证后,我们总会希望把文件域中的值给清空了,在IE中,由于安全设置的原因,是不允许更改文件域的值的,接下来为大家介绍一下解决方法 一般来说,在对一个 ...

  9. input type file onchange上传文件的过程中,遇到同一个文件二次上传无效的问题。

    不要采用删除当前input[type=file]这个节点,然后再重新创建dom这种方案,这样是不合理的.解释如下:input[type=file]使用的是onchange去做,onchange监听的为 ...

随机推荐

  1. todo---ezmorph

    todo---ezmorph

  2. 第三坑:jar包编译版本

    这个是之前往was上发应用的时候踩的一个坑,当时我们知道was的jdk版本是1.6,然后我们是用1.7的jdk,编译版本选的是1.6,然后放上去不对,我们以为是编译的问题,然后又下载了1.6的jdk, ...

  3. 洛谷 P1019单词接龙

    看吧,多简单啊,没有人受伤的世界完成了.                                                                                ...

  4. Oracle数据库 SET ECHO [ON|OFF]

    说明 -- 运行.sql文件时,显示.sql文件中的语句 SET ECHO ON -- 运行.sql文件时,不显示.sql文件中的语句 SET ECHO OFF Oracle 11g Release ...

  5. Scratch编程:牛顿的苹果——地心引力

    牛顿的苹果 同学们,你们知道牛顿的苹果的故事吗? 传说1665年秋季,牛顿坐在自家院中的苹果树下苦思着行星绕日运动的原因.这时,一只苹果恰巧落下来,它落在牛顿的脚边.就是这个偶尔的瞬间,牛顿发现了苹果 ...

  6. Skip List(跳跃表)原理详解与实现

    ref : https://dsqiu.iteye.com/blog/1705530   本文内容框架: §1 Skip List 介绍 §2 Skip List 定义以及构造步骤   §3 Skip ...

  7. css 背景 background

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! background我们一般用到的的属性有: background-attachment:背景(图片)是否 ...

  8. 初试Maven

    1 [检查]确认已经安装jdk,已经环境变量中配置JAVA_HOME,已经修改Path 2 [下载]从http://maven.apache.org/download.cgi下载所需要的版本,笔者使用 ...

  9. Down State Flush Feature

    Down State Flush Feature ========================================================== Citrix NetScaler ...

  10. JS基础_使用工厂方法创建对象(了解下就行了,用的不多)

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