这个实现比较简单，就是用到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. js generator的两个实际应用

    generator作为一个用来操作异步的状态机, 遇到yield停止, 通过调用next()来继续操作.  今天就用generator来举例两个实际开发中的应用. 1,抽奖 function draw ...

  2. 2.14 Java web 复习总结

    1.空指针异常原因(NullPointerExceptio)之一: 在Dao层里边 声明 Connection conn = DBUtil.getConn(); //不能少 Statement sta ...

  3. 前端安全之 XSS攻击

    参看: XSS的原理分析与解剖 前端安全 -- XSS攻击 web大前端开发中一些常见的安全性问题 1.前言 XSS 是面试时,hr提出来给我的,然后大体的浏览一遍,今天才查阅资料大体了解了它. XS ...

  4. 记录一次ajax使用

    function getSSOUrl(urlvalue) { var urls; $.ajax({ type: "GET", url: "../../GeoManage/ ...

  5. nosql的介绍以及和关系型数据库的区别

    一直对非关系型数据库和关系型数据库的了解感觉不太深入,在网上收集了一些关于sql和nosql的区别和优缺点分享给大家. Nosql介绍 Nosql的全称是Not Only Sql,这个概念早起就有人提 ...

  6. Atom :奥特曼的使用

    最近在使用atom的编译器,很不爽,什么快捷键,还有识别vue的页面,还有注释这种快捷下载下来的都没有 必须到setting里面的install里下载,我能大声的说我很不爽吗............ ...

  7. Redis的安装并配置快捷启动

    Redis 安装 1.下载 wget http://download.redis.io/releases/redis-5.0.5.tar.gz 2.解压 tar -zxvf redis-5.0.5.t ...

  8. HDU - 6025 Coprime Sequence（前缀gcd+后缀gcd）

    题意:去除数列中的一个数字,使去除后数列中所有数字的gcd尽可能大. 分析:这个题所谓的Coprime Sequence,就是个例子而已嘛,题目中没有任何语句说明给定的数列所有数字gcd一定为1→_→ ...

  9. POJ 3984：迷宫问题 bfs+递归输出路径

    迷宫问题 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 11844   Accepted: 7094 Description ...

  10. oracle提交commit后回退恢复

    -------------------------------------------------------begin---------------------------------------- ...