这个实现比较简单，就是用到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. yum对于包和软件的安装、升级和卸载总结

    在Centos下yum的安装.升级和卸载 一.使用yum安装和卸载软件,有个前提是yum安装的软件包都是rpm格式的.安装的命令是,yum install ~,yum会查询数据库,有无这一软件包,如果 ...

  2. 文本编辑器vim/vi——命令模式

    一个完整的指令的标准格式: Linux通用的格式——#指令主体(空格) [选项](空格) [操作对象] 一个指令可以包含多个选项,操作对象也可以是多个. vim指令: 指令:vim   (vim是一款 ...

  3. SpringBoot 上传文件突然报错 Failed to parse multipart servlet request; nested exception is java.io.IOException: The temporary upload location [/tmp/tomcat.1428942566812653608

    异常信息 org.springframework.web.multipart.MultipartException: Failed to parse multipart servlet request ...

  4. Power BI Desktop 安装环境

    Power BI Desktop 环境 最低要求 Windows 7/Windows Server 2008 R2 或更高版本 .NET 4.5 Internet Explorer 9 或更高版本 内 ...

  5. WCF 异常 The server was unable to process the request due to an internal error.

    实习用的C#,不搞.NET,但且记下. 只有标题中的错误提示,完全不知道哪里出错,要么是Oracle服务器.要么是服务程序,最不愿代码有问题. <behaviors> <servic ...

  6. bool之regexp正则注入(原理详解)

    感谢原创博主的文章,在此致敬.本文转自:http://www.cnblogs.com/lcamry/articles/5717442.html 我们都已经知道,在MYSQL 5+中 informati ...

  7. bool盲注中用到的截取字符串的函数(mid、substr、left)

    介绍一下常用的:mid.substr.left 1.mid()函数 此函数为截取字符串一部分.MID(column_name,start[,length]) 参数 描述 column_name 必需. ...

  8. jedis的ShardedJedisPool链接池的扩容问题

    回顾上一篇文章jedis连接池的构建. 我们来分析ShardedJedisPool的基于客户端分片所可能带来的问题:扩容 ShardedJedisPool的节点扩容 .ShardedJedisPool ...

  9. 【剑指Offer】面试题24. 反转链表

    题目 定义一个函数,输入一个链表的头节点,反转该链表并输出反转后链表的头节点. 示例: 输入: 1->2->3->4->5->NULL 输出: 5->4->3 ...

  10. Angular全局数据管理与同步更新

    自定义实现angular中数据的状态管理,如有不妥请指正 一.先介绍一下rxjs中subject: Import {subject}from’rxjs’ Subject 数据的订阅与分发,结合报刊的发 ...