html input file 控件 在不同浏览器 显示不同的解决方案
问题描述
html 中的 input type 为file的控件
在Chrome浏览器中的显示
图片 来自 https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file
但是在 edge浏览器中
图片 依旧来自 https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file
本来就是一个网址 但到了不同的浏览器里面 显示的不一样了
一开始以为有什么,属性可以设置。。。。。。
官方留下了什么对外的接口之类,但木有找到。。。。。。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
<title>file</title>
</head>
<body>
<input type="text" placeholder="choose file,please" id = "ipt" disabled style="width: 300px;"/>
<input type="button" value="choose" id = "btn"/>
<input type="file" id='ftn' style="display: none"/>
<script type="text/javascript">
btn.onclick = function(){
ftn.click();
ipt.value = ftn.value;
}
</script>
</body>
</html>
最后咨询了一下 前辈
file 需要 隐藏着使用
于是写下了 上面的代码
仅供参考
欢迎讨论