Firefox fires by choice, not change

Question

Consider this:

<input type="file" id="filePicker"> <script> document.getElementById('filePicker').onchange = function() { alert('Hi!'); }; </script> 

Even if you select the same file and the filePicker value filePicker not change, you will see a warning window in Firefox. Any solutions?

Answer 1

Use a temporary variable to store the name of the file name, which you can check with the following file selection:

 var filenameTemp = null; document.getElementById('filePicker').onchange = function(e) { var filename = e.target.value; if (filename !== filenameTemp) { filenameTemp = filename; console.log('OK'); // other code } else { console.log('Not OK') } }; 

Demo

Answer 2

Run the snippet below. He will say "New file!". when there is a new file for Chrome and Firefox.

 var previousFile = {}; function isSame(oldFile, newFile) { return oldFile.lastModified === newFile.lastModified && oldFile.name === newFile.name && oldFile.size === newFile.size && oldFile.type === newFile.type; } document.getElementById('filePicker').onchange = function () { var currentFile = this.files[0]; if (isSame(previousFile, currentFile) === false) { alert('New File!'); previousFile = currentFile; } }; 

 <input type="file" id="filePicker">