input+type=file同时支持文件和文件夹

阿超

发布于 2023-06-23 14:17:08

6230

文章被收录于专栏：快乐阿超快乐阿超

1没有知识的旅游者是一只没有翅膀的鸟。——萨阿迪

使用的dropzone库，你可以将任意类型的文件拖拽进去上传，如果是目录，则会获取目录内的文件

https://github.com/dropzone/dropzone

代码如下：

<link
  rel="stylesheet"
  href="https://unpkg.com/dropzone@5/dist/min/dropzone.min.css"
  type="text/css"
/>

<script src="https://unpkg.com/dropzone@5/dist/min/dropzone.min.js"></script>

<div class="my-dropzone dz-clickable" style="
    display: block;
    width: 100px;
    height: 100px;
    background: greenyellow;
"></div>

<script>
  // Dropzone has been added as a global variable.
  const dropzone = new Dropzone("div.my-dropzone", { url: "/file/post" });
   console.log({dropzone})
</script>

效果：

// Dropzone has been added as a global variable. const dropzone = new Dropzone("div.my-dropzone", { url: "/file/post" }); console.log({dropzone})

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2023-06-02，如有侵权请联系 cloudcommunity@tencent.com 删除

file