Question

我有一个表单，有一个输入类型文件，该元素有一个按钮，点击事件调用一个函数来上传文件（图像），之后用户填写了所有他的数据点击按钮验证，我想在用户点击上传文件并上传文件后清除输入类型文件，因为发生的是要上传到服务器的文件需要时间，当用户点击上传文件时，以及当他点击验证按钮时它作为表单的一个元素传入http请求，所以我想要的是在上传后从输入中删除文件，这是我的代码我测试了不同的场景，但没有一个有效。

<div>
    <input type='file' name='img1' id='img1'>
    <input type="button" value="upload" onclick="uploadFile()">
  <progress id="progressBar" value="0" max="100" style="width:300px;"></progress>
</div>

JS

function _(el){
    return document.getElementById(el);

}
function uploadFile(){
    var file = _("img1").files[0];
    var e = document.getElementById("img1");
    var formdata = new FormData();
    formdata.append("img1", file);
    var ajax = new XMLHttpRequest();
    ajax.upload.addEventListener("progress", progressHandler, false);
    ajax.addEventListener("load", completeHandler, false);
    ajax.addEventListener("error", errorHandler, false);
    ajax.addEventListener("abort", abortHandler, false);
    ajax.open("POST", 'distination');
    ajax.send(formdata);
    formdata.delete("img1");
    formdata = '';
    _("img1").files[0] = '';

    e.value ='';
    $('#img1').val('');
    $('#img1')[0].reset();
}

表单的操作是PHP_SELF

Answer 1

我通过搜索StackOverflow找到了你特别想要做的事情：

function resetForm($form) {
    $form.find('input:file').val('');
}
// to call, use:
resetForm($('#myform'));

此解决方案完全来自Resetting a multi-stage form with jQuery

提交表单时的用法示例如下：

$('#validateButton').click(function (e) {
    e.preventDefault();
    resetForm($('#myform'));
    $('#myform').submit();
});

#validateButton和#myform应替换为DOM元素的实际名称。

如何在提交按钮后从输入中删除文件

1 个答案: