如何从表单中删除上传项目？

Question

我有一个允许使用文件输入加载文件的表单。我想允许用户删除上传项目，但我无法弄清楚。到目前为止，这是我尝试做的事情：

<form action="insert.php" method="POST" align="right" id="post_form">
 <input type="file" id="upload_file" onChange="display()">
 <div id="show_button" onClick="remove_pic()">  remove </div><br>
</form>


function remove_pic() {
  alert('check');
  var file_loaded = document.getElementById("upload_file");
  file_loaded = null; // here i try to remove the object
}

Answer 1

通过 JSFiddle 运行您的代码并检查 Chrome 开发控制台后，我不断收到“未定义函数”错误消息。

我发现，将您尝试直接调用的函数显式放入全局范围可以使其被识别为已定义。您还需要使用空白字符串而不是 null 并将对“.value”属性的更改附加到“file_loaded”变量中。

代替

function remove_pic() {
  alert('check');
  var file_loaded = document.getElementById("upload_file");
  file_loaded = null; // here i try to remove the object
}

试试

window.remove_pic = function() {
  alert('check');
  var file_loaded = document.getElementById("upload_file");
  file_loaded.value = ""; // here i try to remove the object 
};

示例 JSFiddle：http://jsfiddle.net/xu6SD/1/