將jQuery插件附加到動態生成的元素

Question

我正在使用插件來管理我的上傳者。但問題是，我每次點擊按鈕時都會添加新的文件上傳器，因此插件只會加載頁面加載時已創建的元素。這是我的一個例子：

<div id="uploaders"> 
    <div class="container"> 
     <div class="file-uploader"> 
      <input type="files" name="files[]"> 
     </div> 
    </div> 
    <button>Add new uploader</button> 
</div> 
<script src="js/file-uploader.min.js"></script> 
<script> 
$(function() { 
    $uploaders = $('#uploaders'); 
    $uploaders.find('.file-uploader input').myPlugin({ options }).on('uploadfinished', function(){ console.log('File uploaded!'); }); 
    $uploaders.find('button').on('click', function(){ 
     $(this).closest('.container').append('<div class="file-uploader"><input type="files" name="files[]"></div>'); //This uploader won't load myPlugin 
    }); 
}); 
</script> 

有沒有一種方法可以將該插件附加到所有生成的文件上傳？我知道在添加HTML之前我可以做到這一點，但這會是一個問題，因爲我必須再次定義所有配置和事件...

Answer 1

使用jQuery .on（）方法並使用這裏描述的「授權事件」方法：http://api.jquery.com/on/