javascript – jQuery:一个带有多个dropzone的拖放式上传

前端之家收集整理的这篇文章主要介绍了javascript – jQuery:一个带有多个dropzone的拖放式上传前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
@H_502_1@我想通过文件夹上的拖放上传来开发文件夹和文件树.

例:

对于拖放上传,我资助jQuery File Upload.

基本代码是:

  1. $('#fileupload').fileupload({
  2. dataType: 'json',url: 'PHP/index.PHP',dropZone: $(document),done: function (e,data) {
  3. $.each(data.result,function (index,file) {
  4. $('<p/>').text(file.name).appendTo(document.body);
  5. });
  6. }
  7. });

在我的项目中,我有多个dropzone(我的文件夹),例如:

  1. <ul>
  2. <li>Bookmarks</li>
  3. <li>Search</li>
  4. <li>Web dev</li>
  5. ...
  6. </ul>

如何更改上面的代码来处理带有id,class和jQuery选择器的多dropzone?

我试过这样的东西,但显然它不起作用:

  1. <ul>
  2. <li id="folder1" class="folder">Bookmarks</li>
  3. <li id="folder2" class="folder">Search</li>
  4. <li id="folder3" class="folder">Web dev</li>
  5. ...
  6. </ul>

.

  1. $('.folder').fileupload({
  2. dataType: 'json',dropZone: $('.folder'),file) {
  3. $('<p/>').text($(this).attr(id)).appendTo(document.body);
  4. });
  5. }
  6. });

问题:

>上传完成3次.
> $(this)不存在.

解决方法

我找到了一位同事的解决方案.

实际上并不复杂:

  1. $('.folder').each(function(){
  2. var $this = $(this);
  3.  
  4. $this.fileupload({
  5. dataType: 'json',dropZone: $this,data) {
  6. $.each(data.result,file) {
  7. $('<p/>').text($this.attr('id')).appendTo(document.body);
  8. });
  9. }
  10. });
  11. });

编辑:我的不好,这个答案是在the documentation.

猜你在找的jQuery相关文章