IE下表单控件多层嵌套导致input file需要双击才有效

2022-05-18 16:36 栏目：技术开发 查看(2290)

某项目在IE浏览器下，文件上传按钮点击无效，而在其他非IE浏览器下是没问题。通过测试发现，在IE浏览器下需要快速双击文件上传按钮才有效。代码如下：

<button><input accept=".pdf" name="file" type="file" /></button>

后面得知该项目这一部分是使用了某前端框架，这种方式在IE下会存在问题，原因在于在input上嵌套了同样为表单组件的button元素。原因在于同样是表单组件，每次第一次点击都作用到外层的button上面，所以必须快速双击才有效。外层修改为非表单组件即可，如下：

<div><input accept=".pdf" name="file" type="file" /></div>

其实如果是手写代码一般不会这样嵌套，一些框架可能是为了组件化，然后实例化自动生成的html代码。

我们在微信上24小时期待你的声音

解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流

转载请注明出处：IE下表单控件多层嵌套导致input file需要双击才有效 - 微构网络

新动态