2012-11-05 48 views
1

我使用jquery-filedrop將文件拖放到我的網站,但是我遇到了動態dropzones的問題。代碼的安裝方式有問題嗎?該腳本對加載頁面時存在的元素非常有效,但不適用於動態創建的元素。爲FileDrop動態添加dropzone

這裏是我的小提琴與模擬設置。 http://jsfiddle.net/seesoe/4qcfK/

和繼承人的JS代碼

$(document).ready(function() { 
    $('.cloneMeButton').live('click', function() { 
     $('.cloneMaster').clone().attr('class', 'dropzone').text("Dynamic Dropzone Clone").show().appendTo('body'); 
    }); 

    var dropzone = $('.dropzone'); 

    dropzone.filedrop({ 
     dragOver: function() { 
      $(this).removeClass('dropzone').addClass('dropzone_on'); 
     }, 
     dragLeave: function() { 
      $(this).removeClass('dropzone_on').addClass('dropzone'); 
     }, 
     drop: function() { 
      $(this).removeClass('dropzone_on').addClass('dropzone'); 
     } 
    }); 
});​ 

回答

1

簡單忽視的解決方案,在功能包filedrop並召回其在每個,添加事件

http://jsfiddle.net/4qcfK/3/

$(document).ready(function() { 
    $('body').on('click', '.cloneMeButton', function() { 
     $clone = $('.cloneMaster').clone(); 
     $clone.text("Dynamic Dropzone Clone").addClass('dropzone').show().appendTo('body'); 
     fileDropIt($clone); 
    }); 

    fileDropIt($('.dropzone')); 

});​