上传图片的时候,有时会加一些限制,如下,进行上传类型的过滤,如

<input type="file" name="pic" id="pic" accept="image/*" />  
accept="image/*  Chrome和Safari等Webkit浏览器下却出现了响应滞慢的问题,可能要等 6~10s 才能弹出文件选择对话框。在IE和Firefox中使用 accept=”image/*” 属性则没有发现响应延迟的问题;
此时建议删掉它或者将 * 通配符修改为指定的MIME类型,就可以解决Webkit浏览器下的对话框显示滞慢的问题。
<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg">

accept=”audio/*”和 accept=”video/*” 属性 在 Webkit浏览器下也会有同样的响应延迟的问题。同理,通过将 * 通配符 修改成指定的MIME类型就可解决。

input-file类型accept 属性对性能的影响的更多相关文章

  1. 在webapp上使用input:file, 指定capture属性调用默许相机,摄像,录音功能

    ## 在webapp上使用input:file, 指定capture属性调用默认相机,摄像,录音功能 在iOS6下开发webapp,使用inputz之file,很有用 <input type=& ...

  2. input标签的accept属性、JQuery绑定keyDown事件

    一. input标签的accept属性 当我们上传文件或者注册上传头像时,我们可以一般都是使用: <input type="file" id="my_file&qu ...

  3. 一天五道Java面试题----第九天(简述MySQL中索引类型对数据库的性能的影响--------->缓存雪崩、缓存穿透、缓存击穿)

    这里是参考B站上的大佬做的面试题笔记.大家也可以去看视频讲解!!! 文章目录 1.简述MySQL中索引类型对数据库的性能的影响 2.RDB和AOF机制 3.Redis的过期键的删除策略 4.Redis ...

  4. input file类型,文件类型的限制

    直接限制input type='file'的文件类型限制,通过accept属性进行设定,多个类型用逗号分隔开,因为accept是html5的新特性,所以火狐和IE的支持就显得单薄了, 如:

  5. HTML <input> 标签的 accept 属性

    <form> <input type="file" name="pic" id="pic" accept="im ...

  6. ## 在webapp上使用input:file, 指定capture属性调用默认相机,摄像,录音功能

    在iOS6下开发webapp,使用inputz之file,很有用 <input type="file" accept="image/*" capture= ...

  7. input file 类型为excel表格

    以下为react写法,可自行改为html的 <div className="flag-tip"> 请上传excel表格, 后缀名为.csv, .xls, .xlsx的都 ...

  8. 改变文件上传input file类型的外观

    当我们使用文件上传功能时,<input type="file">,但是外观有点不符合口味,如何解决这个问题? <input type="file&quo ...

  9. HTML 文件类表单元素如何限制上传类型,Accept属性设置

    需求描述:简单的控制file的选择类型 解决方法:使用HTML  input file 的accept属性控制 实例: <form action="demo_form.asp" ...

随机推荐

  1. Charles使用方法简介

    Charles是一个web代理器,用来记录和展示你所发出和接收到的所有数据. 主要特性: SSL Proxying——易清晰地文本展示SSL请求和响应Bandwidth Throttling是用来模拟 ...

  2. Linux软件源apt 仓库 包 的概念

    概念介绍: 软件源是debian系的概念,把软件放在一个pool里面,用一条命令就可以自动从指定服务器下载并安装. 源列表是/etc/apt/sources.list,里面写了你所用的服务器地址 (其 ...

  3. 浅谈ORM操作

    2. ORM(对象关系映射) 1. 映射的关系 DB ORM 数据表 <--> 类 数据行 <--> 对象 字段 <--> 属性 2. Django项目使用MySQ ...

  4. Nginx配置SSL报错 nginx: [emerg] unknown directive "ssl"

    Nginx配置SSL报错 nginx: [emerg] unknown directive "ssl"     出现如图所示错误,处理办法如下 去nginx解压目录下执行 ./co ...

  5. 10.Web组件复用

    1.静态包含(一个指令) 在软件工程中构建可复用组件可极大的提高软件生产效率.增强系统的可维护性HTML标记对于一个web应用系统中的页面都是通用的,比如公司标志.版权声明.导航菜单JSP中引用的we ...

  6. vue.js请求数据(axios)

    使用npm安装axios npm install axios --save 在main.js中引入axios import axios from "axios"; 注册axios到 ...

  7. my.答题

    20170821增加: http://www.119you.com/mhxy/yxgl/738653.shtml 1.三界奇缘 http://my.netease.com/forum.php?mod= ...

  8. Dev Express Report 学习总结(六)Dev Express Reports自定义Summary

    在我们使用DevExpress开发报表的过程中,对于页面中复杂的数据合计,我们可能会使用到自定义Summary.下面通过一个例子来进行说明: 首先,我建立了如上图所示的报表页面,其中的数据源来自cla ...

  9. Android NDK开发 Jni中打日志LOG(二)

    HelloJni.c文件中,加入头文件和函数声明.最终文件如下: #include <jni.h> #include <string.h> #include<androi ...

  10. 数据库版本管理工具flyway

    引入flyway_core  jar包 java 代码实现 public class FlywayMigration { @Resource private DataSource dataSource ...