首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >自定义文件输入按钮,在div inside按钮中为文件输入创建不可见的输入文件类型。

自定义文件输入按钮,在div inside按钮中为文件输入创建不可见的输入文件类型。
EN

Stack Overflow用户
提问于 2022-04-20 03:57:04
回答 1查看 531关注 0票数 0

我想做一个文件输入按钮,就像Amazon中的那个,写一个下面的评论

如果输入文件类型是隐藏的,整个按钮怎么可能打开文件对话框?

这里的代码隐藏了输入文件类型按钮,但没有打开文件对话框。它使用的是与顺风类交互的方法。

代码语言:javascript
运行
复制
    <button
      type="button"
      className="p-6"
    >
      <div aria-label="Add a photo">
        <HiOutlinePlus className="text-4xl" />
        <input type="file" accept="image/*" className="hidden" />
      </div>
    </button>
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-04-20 04:13:08

,如果输入文件类型是隐藏的,整个按钮怎么可能打开文件对话框?

可能使用单独的小部件,然后单击打开隐藏文件输入,如下所示:

代码语言:javascript
运行
复制
function openFileUpload() {
  document.getElementById("hiddenFile").click();
}
代码语言:javascript
运行
复制
<button onclick="openFileUpload()" type="button">Visible Button</button>
<input type="file" id="hiddenFile" style="visibility:hidden">

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

https://stackoverflow.com/questions/71933912

复制
相关文章

相似问题

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