Bezdepbonusu7Программирование: статьи и ответы

Вопрос

Как сериализовать ввод типа файла в jquery

Автор вопроса: GeshanОтветов: 5

Раньше, используя Prototype, я мог сериализовать файл типа ввода, он дал мне имя загружаемого файла, но когда я сериализовал форму в jquery, я просто получил текст типа ввода, а другие не файл, как мне это сделать?

  • Возможно, какой-нибудь код, показывающий, что вы делали раньше и что вы пытаетесь сделать сейчас, поможет... Cᴏʀʏ 27.05.2009

formsjqueryserialization

Ответы

Ответ 1 · рейтинг 11 · Sampson

Проведя несколько минут в Firebug, кажется, что на самом деле есть несколько способов сделать это. Например, мне удалось получить список файлов из самого объекта fileObject:

var file = $("#control").attr("files")[0];
var fileName = file.fileName;
var fileSize = file.fileSize;

alert("Uploading: "+fileName+" @ "+fileSize+"bytes");

Ясно, что я могу прочитать значения для сериализации. Но писать - это другой вопрос.

Но, видимо, это не так просто, как утверждают другие. Я позволил себе загрузить исходный код Prototype и не смог найти инструкции по использованию данных FileList для объекта File Upload.

На самом деле, я нашел в Интернете статью, в которой каталогизировались проблемы с сериализацией самого объекта File Upload, утверждая, что ни одна библиотека AJAX не справляется с этим хорошо (обратите внимание, это было написано в 2007 году). Тем не менее, эта тема интересна, и кажется, что вы можете разработать любое количество методов для извлечения данных из загрузки файлов - сама спецификация содержит достаточно информации, чтобы направить вас по этому пути.

Хотелось бы, чтобы у меня был ответ о том, как вы можете писать и добавлять файлы в список файлов, но на данный момент я так же потерян, как и вы (или были в то время, когда задавали этот вопрос). Если немного больше почитать, это может оказаться намного проще, чем я подозреваю, но в данный момент у меня нет времени вкладывать деньги.

Удачи.

Соответствующая документация

  1. Загрузка файлов на W3C
  2. Сериализация форм, Гаррет Смит, 2007 г.
  3. Исходный код прототипа 1.6.1RC3 (строка 3967: Form.serializeElements начинается )

Ответ 2 · рейтинг 4 · anewcomer

Как уже упоминалось, вы можете отправить форму, содержащую файловые входы, через ajax, но для этого требуется какая-то волосатая магия iframe. Если вы не возражаете против использования jQuery, я настоятельно рекомендую функцию ajaxSubmit плагина jquery.forms.

Ответ 3 · рейтинг 3 · Community

Это новая функция в FireFox 3.

Посетите http://blog.igstan.ro/2009/01/pure-javascript-file-upload.html

Ответ 4 · рейтинг 3 · Adam Jimenez

Соответствующая ошибка jQuery: http://bugs.jquery.com/ticket/2656.

Я добавил свой собственный метод serializeAll вместо сериализации:

    (function($) {
    $.fn.serializeAll = function() {
        var rselectTextarea = /^(?:select|textarea)/i;
        var rinput = /^(?:color|date|datetime|datetime-local|email|file|hidden|month|number|password|range|search|tel|text|time|url|week)$/i;
        var rCRLF = /\r?\n/g;

        var arr = this.map(function(){
            return this.elements ? jQuery.makeArray( this.elements ) : this;
        })
        .filter(function(){
            return this.name && !this.disabled &&
                ( this.checked || rselectTextarea.test( this.nodeName ) ||
                    rinput.test( this.type ) );
        })
        .map(function( i, elem ){
            var val = jQuery( this ).val();

            return val == null ?
                null :
                jQuery.isArray( val ) ?
                    jQuery.map( val, function( val, i ){
                        return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
                    }) :
                    { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
        }).get();

        return $.param(arr);
    }
})(jQuery);

Затем позвоните:

$('#form').serializeAll()

Ответ 5 · рейтинг 1 · burghard.britzke

В источнике Prototype (упомянутом выше) serializeElements различает "element.type != 'file'" и другие. Тип элемента "файл" не сериализуется.

Перевод вопроса и ответов сообщества Stack Overflow, лицензия CC BY-SA. Оригинал на Stack Overflow.

Похожие материалы