jquery - FileList にファイルを追加する方法

Question

これについて私を助けてください：

更新: コンソール ログでは、マージされたものとして表示されますが、長さには最後にドラッグされた長さが表示されます

up_files = event.originalEvent.dataTransfer.files;divにドラッグアンドドロップされたファイルをキャプチャするために使用しています。

ユーザーが初めてファイルをドラッグしたとき、すべてのファイルが移動しup_files、2回目にファイルがdivにドロップされた場合、配列をクリアして挿入する代わりに、それらを既存の配列リストにプッシュするにはどうすればよいですかupfiles

#fileToUpload is a input file id
#total is div id

サンプルコード:

$( '#total' ).bind( 'dragover',function(event) {
                event.stopPropagation();    
                event.preventDefault(); 
        });

  $( '#total' ).bind( 'drop',function(event) {
                        event.stopPropagation();    
                        event.preventDefault();
                        if( upfiles == 0 )
                        {
                                upfiles = event.originalEvent.dataTransfer.files;
                                upfiles = Array.prototype.slice.call(upfiles, 0);
                        }
                        else
                          {
                                     //push the file here
                          }
$( "#fileToUpload" ).trigger( 'change' );
});

編集済み： ここに変更があります：

$( "#fileToUpload" ).change( function() {
          
             $('#total').css("background-image","");
             
                var fileIn = $( "#fileToUpload" )[0];
                if(!upfiles) 
                {
                    upfiles = fileIn.files; 
                    upfiles = Array.prototype.slice.call(upfiles, 0);
                }
                else {
                        if(fileIn.files.length > 0 ) {
                                if( confirm( "Drop: Do you want to clear files selected already?" ) == true )
                                {
                                        upfiles = fileIn.files; 
                                        upfiles = Array.prototype.slice.call(upfiles, 0);
                                }
                                else 
                                        return; 
                        }

//DISPLAYING FILE HERE USING EACH LOOP 
                } });

更新しました ：

私はこのように試しました：

$( '#total' ).bind( 'drop',function(event) {
           
  event.stopPropagation();  
  event.preventDefault();
  alert("hello"+upfiles_new);
  if( upfiles_new == 0 )
  {
     upfiles_new = event.originalEvent.dataTransfer.files;
     console.dir(upfiles_new);
     upfiles = Array.prototype.slice.call(upfiles_new, 0);
  }
 else {
     alert("hello world");
   // console.dir(upfiles_new);
     upfiles_temp = event.originalEvent.dataTransfer.files;
     var upfiles = $.merge(upfiles_temp, upfiles_new)
     console.dir(upfiles);   // in console log it is merged
    upfiles = Array.prototype.slice.call(upfiles, 0); // but in this array it is not  showing
   alert(print_r(upfiles)); 
     console.dir(upfiles);
    }
        $( "#fileToUpload" ).trigger( 'change' );
   });

私はもっ​​と近いと思います..誰かが変更を提案できますか