dropzone.js辅助

Question

目前我使用dropzone.js像这样：

<cfform name='UploadFiles' action="uploadfiles.cfm" class="dropzone"> 

我不能够通过“标签”和“输入，这是一个辅助问题访问此控制。我怎样才能使这个键盘可访问？

Answer 1

dropzone不能从键盘上工作。您必须实现另一个键盘可访问的控件（如本机input[type=file]）

Answer 2

我通过在Dropzone消息中添加<button>元素来实现键盘辅助功能。 看到的片段：

Dropzone.autoDiscover = false; 
 

 
// Putting a <button> element in the dropzone message which can be targeted by the keyboard. 
 
// Note: Clicking the dropzone area or the button will trigger the file browser. 
 
var myDropzone = new Dropzone('#my-awesome-dropzone', { 
 
\t dictDefaultMessage: "Drop files here or <button type='button'>select</button> to upload." 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.css" rel="stylesheet"/> 
 

 

 
<label for="in1">Input 1</label> 
 
<input type="text" id="in1"> 
 
<br/> 
 
<label for="in1">Input 2</label> 
 
<input type="text" id="in2"> 
 

 
<form action="/file-upload" 
 
     class="dropzone" 
 
     id="my-awesome-dropzone"></form> 
 
     
 
<label for="in1">Input 4</label> 
 
<input type="text" id="in4"> 
 
<br/> 
 
<label for="in1">Input 5</label> 
 
<input type="text" id="in5">

通过设置配置选项为：

dictDefaultMessage: "Drop files here or <button type='button'>select</button> to upload." 

你可以通过标签和目标该按钮，按下回车键和文件浏览器弹出。

我只是在试图解决同样的问题时偶然发现了这个问题，但它似乎能够正常工作。有关Dropzone可配置选项的详细信息，请访问：http://www.dropzonejs.com/#configuration