拖放输入文件

Question

我有一个带有输入的表单来添加要上传的文件。我需要创建一个放置区域，用户可以拖放文件并按下按钮进行上传。到目前为止，我编写了以下代码：

HTML代码

<form name="form_name" action="#" method="POST" enctype="multipart/form-data">
  <input type="submit" name="button_1"  id="button_1" role="button"/>
  <input type="file" value="" name="file_upload" id="file_upload_id">
    <div class="dropzone2" id="dropzone2" ondrop="drop(event)" ondragover="allowDrop(event)">
      <img src="https://www.mylink.com/img.jpg">
    </div>
</form>

我需要更改下面的JS代码，以便自动选择已删除的文件，就像用户通过资源管理器窗口选择文件一样。关于如何做的任何提示？

JS代码

        function allowDrop(ev) {
            ev.preventDefault();
        }

        function drag(ev) {
            ev.dataTransfer.setData("text", ev.target.id);
        }

        function drop(ev) {
            ev.preventDefault();
            var data = ev.dataTransfer.getData("text");
            ev.target.appendChild(document.getElementById(data));
        }