1
동적으로 생성 된 4 개의 테이블이 있습니다. 각 셀에는 두 개의 div가 있습니다 (td). 모든 divs는 droppable입니다. 이유는 모르겠지만 두 번째 div 만 draggable을 허용하고 첫 번째 div는 되돌립니다. 두 div 사이에는 차이가 없습니다 (exepts에는 "점선"클래스가 있음). 당신이 작동 낙하 할에jQuery UI draggable 되돌리기
tolerance: 'touch'
을 추가하는 경우 http://jsbin.com/OMIbOGU/22/edit
JS
$("document").ready(function(){
function init(){
var table = $("<table></table>");
$("body").append(table);
for(var i=0 ;i < 9; i++){
var row = $("<tr></tr>");
var cell = $("<td></td>");
for(var j = 0;j<2;j++){
var slot = $("<div></div>").addClass('slot');
slot.droppable({
accept: ".unassigned"
});
if (j!==1)
slot.addClass("dotted");
cell.append(slot);
}
row.append(cell);
table.append(row);
}
$(".unassigned").draggable({
revert: "invalid",
snap: "td div"
});
}
for(var i = 0 ; i<4;i++)
init();
});