是否可以在動態創建的元素中使用HTML5拖放？

Question

編輯：我知道這看起來像一個重復的問題，但它非常特定於HTML5拖動事件。 我在添加jQuery事件時沒有問題，只是HTML5拖放功能。

我已經多次使用基本的jQuery來為頁面添加拖放功能，但我想為我當前的項目使用新的HTML5拖放功能。 拖動適用於我在HTML中包含的任何元素，但我似乎無法動態添加元素並使它們可拖動。 我懷疑這是因為在創建新元素之前，在加載頁面時綁定了所有可拖動的事件偵聽器。 有沒有人有運氣使用HTML5來動態添加元素可拖動？ 或者有沒有辦法重新綁定事件偵聽器而無需重新加載頁面？

將.bind()與任何HTML5拖動事件一起使用似乎不起作用。 即

$(newElement).bind('drag', function(e){
  console.log('do you even drag, bro?');
});

雖然.bind()與點擊事件工作正常，但不會激發。 我猜這是因為“拖”對jQuery沒什么意義。 順便說一句，我在新元素中包含了draggable="true" HTML標記。

那么，任何人都有將HTML5拖動事件綁定到動態創建元素的成功案例，或者這是不可能的？ 謝謝！

Answer 1

有兩種方法可以實現這一目標。 第一種是使用在調用bind（）時存在的某種祖先元素：

$('.someParent').on('drag', '.newElement', function(){
    console.log('do you even drag, bro?');
});

第二個是構造代碼，以便在創建newElement之后調用bind函數：

var $newElement = $('<div class="newElement"></div>');

$newElement.on('drag', function(e){
    console.log('do you even drag, bro?');
});