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

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

某项目在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需要双击才有效 - 微构网络
分享: