首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在html中替换文件浏览按钮的最佳方式是什么?

在html中替换文件浏览按钮的最佳方式是什么?
EN

Stack Overflow用户
提问于 2008-09-20 13:30:36
回答 4查看 22.6K关注 0票数 18

我知道当您在type="file中使用input标记时,可以替换以html生成的浏览按钮。

我不确定什么是最好的方法,所以如果有人有这方面的经验,请贡献。

EN

回答 4

Stack Overflow用户

发布于 2008-09-20 13:39:24

浏览器并不喜欢你摆弄文件输入,但是这样做是可能的。我已经看过几种技术,但最简单的是将文件输入绝对定位在您想要用作按钮的任何东西上,并将其不透明度设置为零或接近零。这意味着当用户点击图片(或者你在下面的任何东西)时,他们实际上是在点击看不见的浏览按钮。

例如:

代码语言:javascript
复制
<input type="file" id="fileInput">
<img src="...">
代码语言:javascript
复制
#fileInput{
    position: absolute;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
}
票数 5
EN

Stack Overflow用户

发布于 2008-09-20 13:40:40

如果您不介意使用javascript,您可以将文件输入的不透明度设置为0,通过z-index将样式控件放在顶部,并将clickevent从按钮发送到文件输入。请看这里的技术:http://www.quirksmode.org/dom/inputfile.html

票数 2
EN

Stack Overflow用户

发布于 2008-09-20 13:38:01

出于安全目的,这在技术上是不可能的,所以用户不会被误导。

然而,有几个变通方法--以http://www.quirksmode.org/dom/inputfile.html为例。

根据记录,这个问题已经被问到了here (在那里我给了同样的答案)。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/108149

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档