从动态添加的输入字段使用jQuery上载文件

时间:2012-09-13 15:06:09

标签: javascript jquery jquery-plugins file-upload

我使用this jQuery api来处理带状态栏的文件上传。我有以下(工作)代码:

$(".imageinput")
    .live("fileuploadadd", function(e, data) {
        data.dataType = "json";
    })
    .live("fileuploadsend", function(e, data) {
        data.dataType = "json";
        debugger;
        $(
            '<div id="paragraph"' + createNewParagraphID() + '" class="new paragraph image">' +
                '<div class="progressbar"></div>' +
            '</div>' +
            controlDiv + createNewParagraph()
        ).insertAfter($(this).parent());
    })
    .live("fileuploadprogressall", function(e, data) {
        data.dataType = "json";
        var bar = $(this).parent().next().children().css("width", parseInt(100 * data.loaded / data.total, 10) + "%");
    })
    .live("fileuploaddone", function(e, data) {
        data.dataType = "json";
        $.each(data.result, function(index, file) {
            console.log("done");
        });
    });

我需要使用以下代码才能从服务器获得有关上传状态的响应。由于有可能动态添加元素,我需要使用实时方法。

$(".imageinput").fileupload({
    dataType: "json"
});

如何使用动态添加的元素在此api中设置数据类型?

1 个答案:

答案 0 :(得分:0)

我自己找到了答案:

$(".imageinput").live("hover", function(e) {
    $(".imageinput").fileupload({
        dataType: "json",
        start: function(e) {
            $(
                '<div id="paragraph"' + createNewParagraphID() + '" class="new paragraph image">' +
                    '<div class="progressbar"></div>' +
                '</div>' +
                controlDiv + createNewParagraph()
            ).insertAfter($(this).parent());
        },
        progressall: function(e, data) {
            var bar = $(this).parent().next().children().css("width", parseInt(100 * data.loaded / data.total, 10) + "%");
        },
        done: function(e, data) {
            $.each(data.result, function(index, file) {
                console.log("done");
            })
        }
    })
});