我正在使用具有以下选项的可拖动:
$("#accountDetailPanel .draggable").draggable({
helper: 'clone',
appendTo: 'body',
cursor: 'move',
revert: 'invalid'
});
$(".accountPod").droppable({ accept: '.draggable' });
我在加载时将可拖动应用到 jquery UI 选项卡的第二个选项卡的内容:
问题只是第一次拖动工作正常。当我不将可拖动对象拖放到可接受的可拖放对象中时,吊舱会恢复原状,但我无法再次拖动。无论如何,被拖动的 pod 都失去了可拖动性。
在尝试对可拖动的 init 应用停止功能时,我走上了需要嵌套无限 .draggable 调用的道路。
完整脚本:
$(document).ready(function(){
$("#tabs").tabs();
/**
* Click on account pod -> account detail pane is populated
* Inside account detail, tabs pulled dynamically
* Installation List - each installation (home) is movable
*/
$(".accountPod").live("click", function(event){
var account_id = $(this).attr("id").replace("acct_", "");
// load user's details into tab panel (replace all tabs)
$("#accountDetailPanel").load("/accountDetail/" + account_id, function(){
// post-load of tabs html
$("#tabs").tabs();
// init draggables
$("#accountDetailPanel .draggable").draggable({
helper: 'clone',
appendTo: 'body',
cursor: 'move',
revert: 'invalid'
});
$(".accountPod").droppable({ accept: '.draggable' });
});
});
});
由于这个小提琴有效:http: //jsfiddle.net/notbrain/DycY6/41/我肯定认为它与加载选项卡时 .draggable() 的动态应用有关。
任何指针都非常感谢!