Блог

я использую API для передачи всей формы, включая изображения, текстовую область и т.д.

он используется new FormData($('#form')) для передачи данных на сервер.

все прошло гладко, за исключением случаев, когда я что-то делал на <input type="file" id="upload"/>

Я сделал ввод, чтобы показывать изображение каждый раз, когда пользователь загружает новую фотографию.

 $(function() {
$("#upload").on("change", function()
{
    var files = !!this.files ? this.files : [];
    if (!files.length || !window.FileReader) return; // no file selected, or no FileReader support

    if (/^image/.test( files[0].type)){ // only image file
        var reader = new FileReader(); // instance of the FileReader
        reader.readAsDataURL(files[0]); // read the local file

        reader.onloadend = function(){ // set image data as background of div
             //Showing the images here..
        }
    }
});
});
 

Но теперь, когда я снова отправляю форму с помощью Ajax, она не может прочитать или передать изображение. Изображение не передается в базу данных.

Всякий раз, когда я комментирую строку //var files = !!this.files ? this.files : []; , она возвращается в нормальное состояние, но изображение не отображается.

я хочу спросить, есть ли альтернативный способ показать изображение, не затрагивая <input type="file" тег?

Или, если мне нужно создать другой <input type="file" с style="display: none;" помощью, как я могу передать изображение с одного ввода с типом =»file» на другой ввод с также типом =»file»?