Перетаскивание в подэлементе работают странно

Question

Я построить Drag и систему падения, как это: Вот список, который может быть падения в редактируемые Div: код списка выглядит так:

<li class='file'>test<li> 
$("li.file").bind("dragstart",function(e){ 
e.originalEvent.dataTransfer.effectAllow='move'; 
e.originalEvent.dataTransfer.setData('text',$(this).text()); 
});`  

Тогда я получил Div, чтобы получить элемент сопротивления:

<div id='editor'><div> 
$("#editor").bind('dragover',function(e){ 
e.originalEvent.dataTransfer.dropEffect="move"; 
if(e.preventDefault){ 
e.preventDefault(); 
}); 
$("#editor").bind('drop',function(e){ 
    if (e.target==$('#editor')[0]){ 
#add a sub <div class="editorcontent"> under the <div id='editor'> 
} 

Данный код работает fine.Now Я хочу, чтобы добавить новый перетащить событие на «div.editorcontent , чтобы две разные editorcontent ДИВ для переключения их позиция:

$("div.editorcontent").bind("dragstart",function(e){ 
e.originalEvent.dataTransfer.effectAllow='move'; 
}); 
$("div.editorcontent").bind("dragover",function(e){ 
e.originalEvent.dataTransfer.dropEffect="move"; 
if(e.preventDefault){ 
e.preventDefault(); 
} 

}); 
$("div.editorcontent").bind("drop",function(e){ 
    alert(e.target); 
}); 

Но этот код не работает. Я установил точки останова на chrome и, кажется, используется только событие перетаскивания # редактора. Всякий раз, когда я перетаскиваю div.editorcontent, события не происходят. Когда я удаляю элемент div.editorcontent на другом div.editorcontent. Хром входит в событие drop # в редакторе. Так как я могу исправить проблему?

Answer 1

Проблема заключается в том, что когда $ .ready новый add div не существует, поэтому новый обработчик этих divs не привязан к этим div.