jQuery：使用多拖放區進行拖放式上載

Question

我想通過拖放式上載文件夾來開發文件夾和文件樹。

例子：

對於拖動和拖放上傳，基金jQuery File Upload。

的基本代碼是：

$('#fileupload').fileupload({ 
    dataType: 'json', 
    url: 'php/index.php', 
    dropZone: $(document), 
    done: function (e, data) { 
     $.each(data.result, function (index, file) { 
      $('<p/>').text(file.name).appendTo(document.body); 
     }); 
    } 
}); 

在我的項目，我已經多懸浮窗（我的文件夾），例如像：

<ul> 
    <li>Bookmarks</li> 
    <li>Search</li> 
    <li>Web dev</li> 
    ... 
</ul> 

如何更改上面的代碼來處理具有ID，類和jQuery選擇器的多dropzone？

---

我想是這樣的，但顯然它不工作：

<ul> 
    <li id="folder1" class="folder">Bookmarks</li> 
    <li id="folder2" class="folder">Search</li> 
    <li id="folder3" class="folder">Web dev</li> 
    ... 
</ul> 

。

$('.folder').fileupload({ 
    dataType: 'json', 
    url: 'php/index.php', 
    dropZone: $('.folder'), 
    done: function (e, data) { 
     $.each(data.result, function (index, file) { 
      $('<p/>').text($(this).attr(id)).appendTo(document.body); 
     }); 
    } 
}); 

問題：

• 上傳完成3次。
• $（this）does not exist。

Answer 1

我找到了一個同事的解決方案。

其實這並不複雜：

$('.folder').each(function(){ 
     var $this = $(this); 

     $this.fileupload({ 
      dataType: 'json', 
      url: 'php/index.php', 
      dropZone: $this, 
      done: function (e, data) { 
       $.each(data.result, function (index, file) { 
        $('<p/>').text($this.attr('id')).appendTo(document.body); 
       }); 
      } 
     }); 
    }); 

編輯：我的壞，這個答案是the documentation。