如何从多个文件上传中清除javascript中的一个输入类型文件

本文关键字:文件 一个 类型 输入 javascript 清除 | 更新日期: 2023-09-27 18:07:33

我有2个文件上传字段,每个都有"清除"按钮。当我上传文件,点击其中一个"清除"按钮,然后所有的文件上传是明确的。但是我需要清除一个文件。

请参阅我的代码

<input type="file" id="control1"/>
<button id="clear1">Clear</button>
<input type="file" id="control2"/>
<button id="clear2">Clear</button>

var control = $("#control1");
$("#clear1").on("click", function () {
    control1.replaceWith( control1 = control1.clone( true ) );
});

var control2 = $("#control2");
$("#clear2").on("click", function () {
    control2.replaceWith( control2 = control2.clone( true ) );
});

如何从多个文件上传中清除javascript中的一个输入类型文件

试试这个:

<script type="text/javascript">
        function clear2() {
          var fileUpload = document.getElementById("<%=control2.ClientID %>");
          var id = fileUpload.id;
          var name = fileUpload.name;
          //Create a new FileUpload element.
          var newFileUpload = document.createElement("INPUT");
          newFileUpload.type = "FILE";
          //Append it next to the original FileUpload.
          fileUpload.parentNode.insertBefore(newFileUpload, fileUpload.nextSibling);
          //Remove the original FileUpload.
          fileUpload.parentNode.removeChild(fileUpload);
          //Set the Id and Name to the new FileUpload.
          newFileUpload.id = id;
          newFileUpload.name = name;
          return false;
      }
      function clear1() {
          var fileUpload = document.getElementById("<%=control1.ClientID %>");
          var id = fileUpload.id;
          var name = fileUpload.name;
          //Create a new FileUpload element.
          var newFileUpload = document.createElement("INPUT");
          newFileUpload.type = "FILE";
          //Append it next to the original FileUpload.
          fileUpload.parentNode.insertBefore(newFileUpload, fileUpload.nextSibling);
          //Remove the original FileUpload.
          fileUpload.parentNode.removeChild(fileUpload);
          //Set the Id and Name to the new FileUpload.
          newFileUpload.id = id;
          newFileUpload.name = name;
          return false;
      }
    </script>
    <input type="file" id="control1"/>
    <input id="Button1" type="button" value="clickme" onclick="clear1();" />
    <input type="file" id="control2"/>
     <input id="clickMe" type="button" value="clickme" onclick="clear2();" />