javascript - 将文件拖放到 Html 输入

标签 javascript html css input drag-and-drop

我有一个 html 下拉输入和上传按钮,可以按我想要的方式工作,但我希望能够将文件从我的计算机拖到拖放区然后上传。

我该怎么做?

<input id="FileUpload" type="file" accept=".doc, .docx, .ppt, .pptx, .xls, .xlsx, .pdf, .jpg, .jpeg, .png, .gif" multiple="multiple" onchange="CheckFileSize();" />

<asp:Button ID="FileUploadBtn" runat="server" Text="Upload" OnClientClick="return ValidateAndSend('Upload');" />

我有以下无法更改的文档类型,我相信这意味着我无法使用 html5 示例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

最佳答案

我相信 HTML Input 没有拖放文件输入。您应该考虑导入外部脚本,例如 Dropzone.js .

您所要做的就是下载 js 文件并将其导入到您的 html 中,然后按照网站上的说明创建拖放文件输入。 Doctype 标题不应影响此方法。

希望对您有所帮助!

关于javascript - 将文件拖放到 Html 输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45136088/

相关文章:

javascript - 当文本悬停在元素上时发生更改时,抓取 onclick 事件的文本

php - 服务器重启后javascript不工作

javascript - 查看不同的 HTML 页面?

html - 图像下方的空白

javascript - rails 4 : coffeescript only works when there is a post request or when i reload the page

javascript - 在 Spring MVC 中的 AJAX 响应中发送文件

javascript - 重定向到在 angularjs 中不起作用的网页

html - 在 CSS 中制作一个扩展标签有多难?

html - 在 DIV 上居中文本不起作用

javascript - 从对象数组中的属性创建对象