El botón de clic activará la función de configuración y agregará un evento de cambio al archivo de entrada, después de elegir el archivo, se cargará. La pregunta es que se ejecutará varias veces según los tiempos de carga. Traté de restablecer el valor del archivo de entrada después de cargarlo, y aún así se ejecutará dos veces por segunda vez. Cómo solucionar este problema, no quiero actualizar la página y también quiero que solo se ejecute una vez cada clic.

código html a continuación

 <input onclick='setup()' value='btn' type='button' class='btn btn-info'> <form id='formid' method='POST' enctype='multipart/form-data'> <input accept='image/*' id='fileid' type='file' name='my_file' onsubmit='return false' /> <input type='submit' value='Submit' /> </form>

código js a continuación

 function setup(key) { document.getElementById('fileid').click(); document.getElementById('fileid').addEventListener('change', submitForm); function submitForm() { var data = new FormData(); data.append('my_file', $('#fileid').prop('files')[0]); $.ajax({ url: 'ImageUpload.php', type: 'POST', processData: false, contentType: false, data: data, success: function(data) {}, error: function (error) {} }); } }