How to clear the value of input file by js

js clear the value of input file

I encountered a problem when selecting local image upload function. Clicking the file button for the first time to select the image will trigger the onchange event. After obtaining the file, I created an img tag display on the interface. However, after deleting the created img element node, clicking the file button to select the same file, I found that the image has not been recreated.

Analyze the reasons

Because the file you selected last time is the same file as the one you selected this time, the path value of the two times is the same, and the value has not changed, so the file will not trigger the onchange event. Therefore, you need to reset the file value or reset the file's dom after each time Img is created to solve this problem.

Plan 1

After each time I create an img, reset the value of the file to an empty string (assuming other values ​​will report an error)

Tip: The browser's security mechanism does not allow directly using js to modify the value of the file to a value other than an empty string. Forced modification will report the following error:

VM4061:1 Uncaught DOMException: Failed to set the ‘value’ property on ‘HTMLInputElement’: This input element accepts a filename, which may only be programmatically set to the empty string.

var file = ('file');
 = ''; //fileofvalueValues ​​can only be set to empty strings

Plan 2

Reset the file's outerHTML after each time I create an img

var file = ('file');
 = ; //ResetfileofouterHTML

Pure js clear input file

function cleanFile(id){		      	  	   
  var _file = (id);          
  if(_file.files) 
    _file.value = "";
  else{  
    if (typeof _file != "object") return null;          
    var _span = ("span");   
    _span.id = "__tt__";   
    _file.(_span,_file);   
    var tf = ("form");   
    (_file);   
    ("body")[0].appendChild(tf);   
    ();   
    (_file,_span);   
    _span.(_span);   
    _span = null;   
    (tf);
  } 
}

Summarize

The above is personal experience. I hope you can give you a reference and I hope you can support me more.