Question

我必须为页面上插入的那些新元素添加draggable和droppable，但由于它们尚未继承可拖动和droppable，就像在页面加载期间完成的那样，我必须为那些人手动添加draggable和droppable新创造的元素。

对于点击事件，我可以简单地执行此操作

$('body').on({
   click:function(){
    //codes here
  }

},'#element');

但是当我处理可拖动和可投放的时候，这似乎不起作用

我有像这样的可拖动设置

$('.photo-segment').draggable({
        containment:'#layout-draggable',
        axis:'y',
        scroll:false,
        revert:"invalid",
        drag:function(event,ui){
            $(this).css({'z-index':9999, 'opacity':'0.8'});
        },
        stop:function(event,ui){
            $(this).css({'z-index':'', 'opacity':'1'});
        }
    });

我可以像这样放置

$('.photo-segment-container').droppable({
        accept:'.photo-segment',
        tolerance:'intersect',
        over:function(event, ui){
            //codes here
        },
        drop:function(event, ui){
            //codes here
        }, 
        deactivate:function(event,ui){
            return false;
        }

    });

我可以在创建这些元素之后手动运行上面这一堆代码，我做过类似的事情

$('.photo-segment').draggable();
$('.photo-segment-container').droppable();

但在这种情况下，我无法检索所有这些设置。我是否必须再次运行我的初始设置？

Answer 1

是的，您需要为新添加的元素再次初始化draggable / droppable。

您可以将设置保存在单独的对象中，以免重复代码。

undefined

如何使用委托UI可拖动？

1 个答案: