Jquery可在父框架和子框架之间进行排序和拖拽 [英] Jquery Sortable and Draggable between parent and child frame

问题描述

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

I am trying to implement jQuery Draggable|Droppable|Sortable between a parent and child frame. I have a this prototype but there is some weird behavior happening

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页面还包含

The iframe page also contains

$("#sortable").sortable();

这是jsfiddle http://jsfiddle.net/vxAzs/5/

Here is the jsfiddle http://jsfiddle.net/vxAzs/5/

当我尝试将元素放在iframe，但是当我尝试对iframe上的元素进行排序时，我认为元素坚持两个页面的click事件（所以在我点击父和iframe之前它不会被删除）。我认为这与父和iframe中的.sortable（）调用有关，但如果我删除了droppable停止工作。

It works fine when I try to drop the element on the iframe but when I try to sort the elements on the iframe the element sticks to the click event of both pages I think (so it doesn't get dropped until I click on both parent and iframes). I think it is something to do with the .sortable() call in both parent and iframe but if I remove that the droppable stops working.

推荐答案

好的，这就是我在做这个的方式..
要在父框架上创建一个元素拖放并将其放在iframe的可排序列表中，
我在元素上创建了draggable来自iframe内部的父框架

ok, here is how I am doing this one.. To create Drag on an element from parent frame and drop it in a sortable list in the iframe, I created draggable on the element of parent frame from inside the iframe

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

像魅力一样！

这篇关于Jquery可在父框架和子框架之间进行排序和拖拽的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！