ie下 input file 双击问题

最新推荐文章于 2021-02-23 12:50:23 发布
最新推荐文章于 2021-02-23 12:50:23 发布
阅读量3.5k 收藏 1
点赞数
分类专栏： html 文章标签： ie input file 双击
本文介绍了在IE浏览器中使用<input type="file">进行文件上传时出现的问题及解决方案。通过调整input元素的透明度和层级位置，可以避免用户需要双击才能打开文件选择窗口的问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

ie浏览器下，使用<input type="file">文件上传，有时需要双击才能打开选择文件的窗口，

解决方案：

只要把input的透明度改为0并且定位到最顶层即可

<input type="file" style="opacity: 0;z-index: 999;">
方案参考如下

http://www.86y.org/art_detail.aspx?id=742

如果仍旧没有解决的话，可以通过margin-left: -90px;

通过对input的定位实现单击혠文件窗口（操作并验证）

【Python】高效的Web自动化测试利器—Python+Playwright快速上手自动化实战指南
墩墩分墩
08-16 6956
**Playwright是微软在` 2020 年初 `开源自动化测试工具，功能和 selenium 类似，都可以驱动浏览器进行各种自动化操作。** - 支持主流浏览器，如Chrome、Firefox、Safari 等，同时支持以**无头模式、有头模式**运行，并提供了**同步、异步的 API**，可以结合 `主流测试框架`使用，并且支持浏览器端的自动化脚本录制等功能。 **特点：** - 跨浏览器：Playwright 支持所有现代渲染引擎，包括Chromium、WebKit 和 Firefox； - 跨
大数据下的日志-前台展示：无按钮浏览（无按钮，自动滚屏）
ESOO
01-29 3029
搜索方便，但是又像看书一样优雅的阅读日志，这是怎么做到的呢？咱们一起分享。
Android-解决在webview中input标签type="file"不能使用的问题
08-13
解决在webview中input标签type="file"不能使用的问题
IE自定义上传按钮光标闪烁,双击上传问题解决
我的技术博客
05-31 916
我们使用自定义上传按钮,一般将input type=”file”透明覆盖在自定义按钮的上面 &lt;span class="file"&gt; &lt;em class="iconfont icon-xuanzezhaopian"&gt;&lt;/em&gt; 选择照片&lt;input type="file" class="do-upload-banner&q
前端文件上传一整套流程（兼容IE8，解决 input标签必须主动点击等问题）
wwqqqq123的博客
10-15 5402
1.基本思路 在谷歌下以&lt;input type=’file’/&gt;为基本的条件，并且使他隐藏，通过点击提交按钮被动触发上传文件的事件，这里不需要用到表单提交的相关问题，在js方面，使用formData，通过获取&lt;input type=”file”&gt;标签的files属性，来获得文件相关的内容，之后再将后台所需的参数加上就可以进行ajax请求上传了。 2.IE8下的处理 首...
file input 点击没反应_解决input file，实现点击文字上传文件
weixin_42299066的博客
02-23 2072
需求： 点击文字“资料提交”，实现文件上传圈是的编小久据直请结未屏屏会气机页实应高 难点： input本身的file样式，文字无法修能调页代事求都学是功发解开宗这维视如间请前框来总在行回断元随来以4移和泉果改点击文字触发input的click事件是不行的解决：将input和文字通过定位，使得input和文字重合将input设置为透明，若input在文字前还的加上z-index:100,...
仿饿了么购物车下单效果
fengyongge的专栏
07-13 7059
仿饿了么购物车下单效果前一段由于新项目需要，开发一个类似饿了么购物车下单效果，电商类、外卖类、点餐类项目都可以用的上,废话不多说请看效果。效果图如下:主要的功能：就是左侧展示分类，右侧展示分类下商品的，点击右侧分类下的商品，如果商品是套餐类型的话，点击可以看套餐详情，下单选择完商品后，可以在购物车里面添加或减少商品数量。主要功能实现：1:分类及商品及购物车里面商品数量的联动效果 2:底部购物车商品
input file上传文件样式支持html5的浏览器解决方案
12-13
最近在使用画布处理图像像素时用到了file上传控件，发现了file上传控件的两个兼容性问题。一个是file上传控件在火狐下无法通过css改变width，另一个是file上传控件在不同的浏览器下的外观和行为都不一样。 下面是...
前端附件上传（兼容ie8）
weixin_44316534的博客
09-15 1387
附件上传的一些总结（兼容ie8） 一、高版本浏览器（ie10+）可用formdata方式 1、获取文件信息，由input[type=‘file’]的onchange事件触发 关键代码（$(this)指代input[type=‘file’]）： var fileName = $(this).context.files[0].name; var fileSize = $(this).context.files[0].size; 2、上传 关键代码： var formData = new FormData();
重学前端 详解表单 / 详解input / 浏览器私有前缀的作用（第六天）
全网同名：PBitW！ 可以去掘金关注我！
07-24 1478
form表单 action method name label（标记） 神奇的input input源css（及type=text） 浏览器前缀 writing-mode（文本在水平或垂直方向上的排布）【对于input】 sideways-lr sideways-rl 2020/8/13补（对于可换行元素）： text-rendering（定义浏览器引擎如何渲染字体） -internal-light-dark【未解决】 letter-spacing（字符间距） word-spacing （字间隔） lett
使用trigger方式实现不用点击file类型的input弹出文件选择对话框
12-14
可以使用trigger方式，javascript中没有原生的trigger函数，可以自己写一个，也可以直接使用jquery的实现： 复制代码代码如下: var button1 = document.getElementById(“button1”); var button2 = document.getElementById(“button2”); button1.onclick = function(){alert(“button1″);trigger(button2,”onclick”);} button2.onclick = function(){al
file input 点击没反应_input file 无法打开手机端文件选择器
weixin_42134054的博客
12-29 6743
版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.youkuaiyun.com/m0_37805167/article/details/78538044手机端对input file的accept格式有特定的要求,必须要image/.这种的格式,否则会在点击上传时弹出无法打开文件选择器这样的提示框 标签,但是默认的file标签很难看,而且每个浏览器下都有很大差距. 1.一般解决办法...
file input 点击没反应_一轮疑难|反应机理图的理解与识别PDF可下载
weixin_42526310的博客
12-17 210
孩子、家长都需要的心理测试：情商测试、专业心理健康测评、专注力评估、学生考试心理健康测试、家长胜任能力测试等12项。点击下图即可进入测试，测试结果可以发到您的微信，为您的决策提供帮助！一、反应机理1. 基元反应基元反应是指反应物分子在有效碰撞中一步直接转化为产物的反应。例如SO2Cl→SO2+Cl2①单分子反应NO2+CO→NO+CO2②双分子反应2NO→2NO+O...
解决input file按钮要点击两次才弹出选择文件窗口
weixin_33827965的博客
05-10 2859
2019独角兽企业重金招聘Python工程师标准>>> ...
Android-WebView-解决对选择文件 input type=“file“无响应
热门推荐
浅浅同学的开发笔记
08-31 2万+
发现一个 Webview 的坑：上个周，项目中有需要接入一个 H5 页面，H5 中有上传图片的功能，接入测试的时候，发现 iOS 端正常，但是所有的 Android 手机在点击上传图片的按钮时，都毫无反应 。当时我的表情是这样的 (˶‾᷄ ⁻̫ ‾᷅˵) 。。问题原因：原因是 H5 访问本地文件的时候，使用的&lt;input type=&quot;file&quot;&gt; ,WebView 出于安全性的考虑，限制了以上操作，
IE8 下的文件上传问题
zhangchunxiaow的专栏
03-05 483
file类型的input框非常丑陋，有的人为了美观，用如下方法： js中的代码如下： 而此种方法在IE8下却行不通，解决方案如下： 先放一个按钮，在后面写一个file,将其透明度调成0，并覆盖在按钮上面，这样当点击按钮时，实际上点击的是file，从而实现了上传功能。 效果如下：
移动端页面inputfile打不开_移动端input“输入框”常见问题及解决方法
weixin_39951378的博客
01-14 897
转自https://www.cnblogs.com/ljx20180807/p/9837748.html1. ios中，输入框获得焦点时，页面输入框被遮盖，定位的元素位置错乱：当页input存在于吸顶或者吸底元素中时，用户点击输入框，输入法弹出后，fiexd失效，页面中定位好的元素随屏幕滚动。针对这个问题，我们一起来看下以下几种方案：方案一： Web API 接口 ：scrollIntoView...
修改input file文件上传的默认样式 兼容ie8
07-11 2878
input(file)浏览按钮美化首先我们先要了解一下各浏览器的浏览按钮的共同特性： 都可以设置整体的宽度和高度，但在IE、火狐、Opera中设置宽度不影响浏览按钮的宽度； 谷歌中只要是input的区域单击可弹出窗口；IE（IE6中没试）中，单击浏览按钮可以弹出窗口，双击文本框区域可以弹出窗口；火狐和Opera中，单击input任何区域都可以弹出窗口； 设置input字体大小，IE、火狐、Opera
file input 点击没反应_解决input file按钮要点击两次才弹出选择文件窗口
weixin_31088605的博客
12-29 2760
相信很多人都碰到过这个问题，文件上传控件透明后有的要点击两次才能弹出选择文件窗口，这里将将介绍如何避免要双击，只需要单击是可以实现的。 本来一直无心留意这个图片上传file按钮的BUG，因为有时候为了效果好看有时候我们要做点什么比如隐藏input模拟点击。FF可以chrome也可 以，唯独IE不行，报安全错误。所以还是得找方法解决，最终在某网站找到了，只是把input按钮的透明度改为0然后定位到最...
实现input file表单在IE8和Firefox下的兼容修改
从给定的文件信息中，我们可以提取出关于修改`input file`表单样式的知识点，并针对IE和Firefox浏览器兼容性问题进行详细讲解。 ### 知识点一：`input file`表单兼容性问题 在Web开发中，`input file`表单元素用于...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值