jQuery 实时可拖动/实时可放置？

Question

基本上有两个表:公司和访客。目前可以将访客拖到公司。效果很好。一旦 drop 函数发生，就会有两个 $.post。第一个将拖动保存到数据库中。第二个更新访问者，因为信息不断变化。但问题是，一旦第二个 $.post 完成，Firebug 就会不断弹出以下错误:

d(this).data("draggable") is null

这发生在 jQuery UI 文件中。在第 56 行。

大约400次左右。所以基本上我正在寻找一种方法来使用可拖动和可放置的 live() 方法。

.draggables 位于#visitors(ul)中。 droppables 位于#companies(一张表)中。

谢谢!

$(".draggable").draggable({
    revert:true
});
$(".droppable").droppable({
    drop: function(ev, ui) {
        $(this).text($(ui.draggable).text());

        $.post('planning/save_visit', {user_id: $(ui.draggable).attr('id'), company_id: $(this).attr('id'), period: $('ul.periods li.active').attr('id')});

        $.post('planning/' + $('ul.periods li.active').attr('id'), {visitors:true}, function(data){
            $('#visitors').html(data);
        });
    },
    hoverClass: 'drophover'
});

Answer 1

重新加载访问者时，您将替换所有可拖动元素，当您执行$('#visitors').html(data);时 - 所以那些元素是可拖动的之前的元素被删除并替换为不可拖动的新元素。 (我很确定您已经意识到这一点，因为提到了 .live()，所以这只是为了完整起见)

但是，您确切知道访问者元素何时发生更改，因此为什么不立即发出另一个可拖动效果请求，而不是 .live() 的替代方案改变后。在替换旧的可拖动对象之前“销毁”它们可能会更安全，但我不确定这是否绝对必要。

$.post('planning/' + $('ul.periods li.active').attr('id'), {visitors:true}, function(data){      
    $(".draggable").draggable("destroy");
    $('#visitors').html(data); 
    $(".draggable").draggable({ revert:true }); 
});