我正在尝试在父框架和子框架之间实现jQuery Draggable | Droppable | Sortable。
我有一个这个原型(prototype),但是发生了一些奇怪的行为
win = document.getElementById('frame').contentWindow;
element = win.document.getElementById('sortable');
$(element).sortable();
console.log(element);
$( "#draggable" ).draggable({
connectToSortable: $(element),
iframefix: true,
helper: function() {return $("<div/>").css('background-color','red');}
});
iframe页面还包含
$("#sortable").sortable();
这是jsfiddle http://jsfiddle.net/vxAzs/5/
当我尝试将元素放置在iframe上时,效果很好,但是当我尝试对iframe上的元素进行排序时,该元素会粘贴到我认为的两个页面的click事件中(因此直到我单击两个父对象时,它都不会被丢弃和iframe)。我认为这与父项和iframe中的.sortable()调用有关,但是如果删除,则droppable将停止工作。
最佳答案
好的,这就是我的做法。
要创建从父框架拖动元素并将其拖放到iframe的可排序列表中的方法,
我从iframe内部在父框架的元素上创建了draggable
win = document.getElementById('<identifier for Iframe>').contentWindow;
win.jQuery(dragelement,parent.document).draggable({
connectToSortable : $("#sortable")
)}
奇迹般有效!