当前位置: 海之晶网站设计> 建站知识> 网站建设>如何使用Vanilla JavaScript制作拖放文件上载程序

如何使用Vanilla JavaScript制作拖放文件上载程序

文章出处:网站建设-海之晶网络 | 网站编辑:网站设计 | 发表时间:2020/10/14 21:46:56
分享:

众所周知,文件选择输入很难按照开发人员想要的方式设置样式,因此许多人只需将其隐藏起来,然后创建一个按钮来打开文件选择对话框。但是,现在,我们有一种更为奇特的处理文件选择的方法:拖放。

从技术上讲,这已经是可能的,因为大多数(如果不是全部)文件选择输入实现允许您将文件拖过它来选择它们,但这需要您实际显示file元素。因此,让我们实际使用浏览器提供的API来实现拖放文件选择器和上载程序。

在本文中,我们将使用“vanilla”ES2015 JavaScript(无框架或库)来完成此项目,假设您对浏览器中的JavaScript有一定的了解。除了ES2015 语法(可以轻松更改为ES5语法或由Babel翻译)之外,此示例还应与所有evergreen浏览器以及IE 10和11兼容。

下面我们将简要介绍一下您将做些什么:

关键字:
南京市汉中路1号国际金融中心9楼
建站热线:13815417591
免责声明: 本站部分内容来源于互联网,如果本站部分内容侵犯您的权益,请您告知,站长会立即处理。