Vượt qua một đối tượng tập tin HTML từ một <input type = file> sang một <type> file = khác>

Question

Tôi muốn thực hiện một trình tải lên nhiều tệp trong một biểu mẫu trong đó tôi muốn các tệp để người dùng có thể sắp xếp mức độ ưu tiên của tệp (tôi đang sử dụng tính năng kéo và công cụ Jquery có thể sắp xếp).

Vì vậy, tôi đã thêm một tập tin đầu vào nhiều như:

<input type = "file" multiple> 

Bây giờ khi tôi chọn một số tập tin, nó cho thấy nói 3 tập tin được chọn. Nhưng khi tôi chọn 3 tệp, tôi muốn chia tệp trình tải lên trong 3 phần để người dùng có thể đặt thứ tự ưu tiên phù hợp.

Cho rằng tôi đã sử dụng các loại mã sau đây:

$('.files').change(function(e){ 
var filesSelected = e.target.files; 
if(filesSelected.length > 1){ //if user selects multiple files, then automatically split the files into multiple divs so that he/she may do the ordering of files 
    //Here I want to create a list of all the files and implement the draggable and sortable thing. 
} 
}); 

Tình hình là, tôi không thể để phân chia các mảng của các đối tượng của FileList và gán từng đối tượng để đầu vào khác.

Hy vọng tôi rõ ràng trong sự nghi ngờ của tôi và câu hỏi là dễ hiểu, vì đây là lần đầu tiên tôi đăng trong diễn đàn như vậy.

Answer 1

Từ các bài đăng tôi nhận được và các cuộc thảo luận ngắn gọn, rõ ràng là đặt giá trị tệp theo lập trình sẽ đặt ra mối đe dọa bảo mật và do đó không phải là một lựa chọn tốt. Theo cách giải quyết vấn đề của tôi, tốt nhất là tìm cách tạo nhiều div/trường chứa tên tệp của các tệp đang được tải lên và sau đó áp dụng tính năng kéo/thả/sắp xếp trong tập hợp div đó. Bằng cách này, người dùng có thể dễ dàng ưu tiên các tệp và trong khi lưu biểu mẫu mảng/trường có mức độ ưu tiên sẽ được xem xét trước khi lưu dữ liệu tệp trong cơ sở dữ liệu.

Nhờ người trả lời phản hồi nhanh của họ.

Answer 2

Bạn có thể cố gắng để lặp qua các tập tin được lựa chọn và sau đó tạo ra một div động với jquery có chứa các dữ liệu từ các tập tin như thế này

$('.files').change(function(e){ 
var filesSelected = e.target.files; 
if(filesSelected.length > 1){ 
    for(var i=0;i<filesSelected.length;i++) { // We iterate through the selected Files 
     $("#idFromParentElement").append('<div> id=File'+i+'</div'); // Then we create and append the new div to the parent element of our choice 
     var fileId = 'File'+i; 
     $("#fileId").data("file",filesSelected[i]); //After that we include a data into the div with the selected file. 
    } 
} 
}); 

Answer 3

Bạn không thể đặt giá trị cho <input type="file"> lập trình. Nó sẽ là một dòng chảy an ninh lớn. Hãy tưởng tượng một số trang web tự động tải lên các tệp tùy ý từ máy tính của bạn.