这个实现比较简单，就是用到accept属性：

注意这里我们对这个file元素进行了隐藏，因为它默认呈现是下面这个样子的，并不好看。

<div style="display:none;">

<input id="upload-file" name="files" accept="image/*" type="file">

</div>　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

html属性，上传图片选择时只显示图片文件的更多相关文章

  1. <input type="file" />浏览时只显示指定文件类型

    <input type="file" />浏览时只显示指定文件类型 <input type="file" accept="appli ...

  2. HTML input="file" 浏览时只显示指定文件类型 xls、xlsx、csv

    html input="file" 浏览时只显示指定文件类型 xls.xlsx.csv <input id="fileSelect" type=" ...

  3. [转]WordPress“添加媒体”文件时只显示上传到当前文章的附件图片

    使用WordPress的朋友应该都清楚,特别是喜欢图文并茂的网站,肯定离不开的就是WordPress文章编辑页面的“添加媒体”按钮,每次点击就能弹出一个插入多媒体的界面,然后页面默认就会列举加载所有最 ...

  4. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  5. input="file" 浏览时只显示指定excel文件，筛选特定文件类型

    <p>显示 .xls, .xlsx, .csv 文件...</p> <input type="file" accept=".csv, app ...

  6. 在子页面使用layer弹出层时只显示遮罩层,不显示弹出框问题

    最近子页面使用layer弹出层时只显示遮罩层,不显示弹出框,这个问题搞了很久,最后才发现,在子页面上使用弹出框时,如果只使用layer.alert()或者layer.open()时,会默认在当前页面弹 ...

  7. css控制打印时只显示指定区域

      CreateTime--2017年9月26日08:16:04 Author:Marydon css控制打印时只显示指定区域 思路: 1.使用打印命令@media print: 2.控制执行打印命令 ...

  8. Matlab7.1——启动时只显示Logo

    1. 现象 Matlab7.1在启动时只显示Matlab的Logo: 2. 解决方法 听我的吧,这个是官方办法,我也亲自试过了1结束matlab进程:2在C:\user\APPDATA\Roaming ...

  9. nput="file" 浏览时只显示指定excel文件，筛选特定文件类型

    <p>显示 .xls, .xlsx, .csv 文件...</p><input type="file" accept=".csv, appl ...

随机推荐

  1. （22）Canny算法

    基础知识,主要是看这个博客:https://blog.csdn.net/qq_41167777/article/details/84863351

  2. Apache nifi 第二篇（小白初试） nifi数据对接流程初次尝试

     一.准备工作 1.官网下载nifi 2.上传到linux随便哪里把,因为nifi是用java写的,所以首先要保证你的linux装了jdk 其次保证系统在装了zookeeper,因为nifi是一个分布 ...

  3. vue使用Vant UI中的swiper组件及传值

    子组件SwiperBanner <!-- --> <template> <div class="swiper"> <van-swipe : ...

  4. vue学习（二）Vue常用指令

    2 Vue常用指令 1. vue的使用要从创建Vue对象开始 var vm = new Vue(); 2. 创建vue对象的时候,需要传递参数,是json对象,json对象对象必须至少有两个属性成员 ...

  5. vue学习（三）组件传值

    组件 官网(https://cn.vuejs.org/v2/guide/components.html) 组件分为局部组件和全局组件 局部组件:是内容中国的一部分 只是在当前组件加载的时候 全部组件: ...

  6. 启用sql日志

    SHOW VARIABLES LIKE "general_log%"; -- 查询是否启用日志 SET GLOBAL general_log = 'ON';  -- 设置启用 SE ...

  7. 【pwnable.kr】bof

    pwnable从入门到放弃,第三题. Download : http://pwnable.kr/bin/bofDownload : http://pwnable.kr/bin/bof.c Runnin ...

  8. 5 ~ express ~ 连接数据库

    1, 在schema 目录创建 users.js 文件,通过 mongoose 模块来操作数据库 2,  在定义 users 表结构之前,需要让应用支持或连接数据库 . 所以要在应用的入口文件 app ...

  9. 《新标准C++程序设计》1.7-1.10（C++学习笔记2）

    1.内联函数(inline关键字) eg.inline int Max(int a,int b) { if(a>b) return a; return b; } 当编译器处理调用内联函数的语句时 ...

  10. 吴裕雄--天生自然JAVA SPRING框架开发学习笔记：第一个Spring程序

    1. 创建项目 在 MyEclipse 中创建 Web 项目 springDemo01,将 Spring 框架所需的 JAR 包复制到项目的 lib 目录中,并将添加到类路径下,添加后的项目如图 2. ...