Question

在我的CMS上，我有一个缩略图列表（可排序）。缩略图工作得很好，现在我正在编写一个插件来将它们拖到一个tinyMCE窗口。

由于tinyMCE窗口有一个iFrame，因此效果不佳。

jQuery为Draggables提供了一个名为iframeFix 的选项，完全按照我的需要运行。但是，该列表必须是Sortables。我在Google上看得很广泛，并没有找到我的要求。 StackOverflow上有没有人完成它？

将iframeFix应用于Sortables？

如果没有......我正在去jQuery插件的路上。

提前谢谢！

Answer 1

我做到了。

你需要在iFrame上放置一个DIV，让Draggable / Sortable流程没有问题。所以我使用jQuery在iframe上创建了一个DIV。然后它会显示它当你抓住元素并在你丢弃时销毁它。奇迹般有效。如果有人需要这样的东西让我知道。

更新（按受欢迎的要求）：

在我的特定场景中，我使用以下DIV：

<div id="iframeDivFixer" class="ui-draggable-iframeFix" style="background-color: rgb(255, 255, 255); display: none; width: 665px; height: 665px; position: absolute; opacity: 0.001; z-index: 1000; left: 362px; top: 290px; background-position: initial initial; background-repeat: initial initial;"></div>

而且，只要我抓取缩略图，javascript就会用于将display属性设置为block。释放拖拽时，此过程相反。

Answer 2

这是一个非常古老的问题，但还有另一种方法可以使用css - pointer-events:none;来支持所有当前支持的浏览器（IE11及以上版本 - caniuse.com）

$("#sortable").sortable({
    start: function() {
        $("iframe").css("pointer-events", "none");
    },
    stop: function() {
        $("iframe").css("pointer-events", "");
    },
});

可排序的jQuery iframeFix

2 个答案: