5

我正在尝试在父框架和子框架之间实现 jQuery Draggable|Droppable|Sortable。我有一个这个原型,但是发生了一些奇怪的行为

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 上的元素进行排序时,元素坚持我认为的两个页面的点击事件(所以在我点击两个父页面之前它不会被丢弃和 iframe)。我认为这与父级和 iframe 中的 .sortable() 调用有关,但如果我删除 droppable 停止工作。

4

3 回答 3

3

好的,这就是我的操作方法。要在父框架中的元素上创建拖动并将其放入 iframe 中的可排序列表中,我从 iframe 内部在父框架的元素上创建了可拖动

win = document.getElementById('<identifier for Iframe>').contentWindow;
win.jQuery(dragelement,parent.document).draggable({
connectToSortable : $("#sortable")
)}

奇迹般有效!

于 2013-03-13T07:01:40.133 回答
0

在您的代码中注释这一行,

//$(element).sortable({iframefix:true});

这是小提琴:链接

于 2013-02-19T06:03:05.933 回答
0

iframeFix 区分大小写:更改

iframefix: true,

iframeFix: true,
于 2013-02-20T14:45:46.753 回答