1. 程式人生 > >使用ajaxfileupload同時上傳多個檔案

使用ajaxfileupload同時上傳多個檔案

ajaxFileupload這個外掛用於上傳檔案,不過它預設是隻能上傳一個檔案。通過修改其原始碼,可以方便地實現多個檔案上傳。

ajaxFileupload的原理挺簡單的,它將使用者指定(通過ID)的file input新增到form裡面,然後將form提交。我們只需要將多個file inputID通過一個列表傳給ajaxFileupload,讓它將多個file input新增到form裡面就可以了。

開啟ajaxfileupload.js,修改如下的地方:

        // 實現多檔案上傳

        if (typeof(fileElementId) == 'string') {

            fileElementId = [fileElementId];

        }

        for (var i in fileElementId) {

            var oldElement = jQuery('#'   fileElementId[i]);

            var newElement = jQuery(oldElement).clone();

            jQuery(oldElement).attr('id', fileId);

            jQuery(oldElement).before(newElement);

            jQuery(oldElement).appendTo(form);

        }

        // 下面是原來的程式碼

使用的時候:

$.ajaxFileUpload({

        url: "/xxx/xxx/xxx",

        secureuri: false,

        fileElementId: [file1,file2,file3,...],// 這個地方變成陣列了

        dataType: 'json',

        data:{

            name: 'files'

        },

        success: function(data, status){

        },

        error: function(XMLHttpRequest)

        {

})

有問題請留言。