组合 Draggable、Resizeable 和 Aloha Editor ExtJS 组件答案

【问题标题】：Combined Draggable, Resizeable and Aloha Editor ExtJS component组合 Draggable、Resizeable 和 Aloha Editor ExtJS 组件
【发布时间】：2013-09-04 17:01:07
【问题描述】：

我正在尝试创建一个 Ext.Component，我可以将它与 Draggable、Resizable、Float 和 Aloha Editor 一起使用。

目前我已经尝试过：

afterRender: function(me) {
    Aloha.jQuery('#' + me.myId).aloha();
    document.getElementById(me.myId).setAttribute("draggable", true);
}

这个不允许它是可拖动的，但编辑工作。

Aloha.jQuery('#' + me.myId).aloha();
draggable: true,
resizeable: true,
float: true

这个允许它重新调整大小并拖动它，但是它不起作用，因此它是不可编辑的。

Aloha.jQuery('#' + me.myId).draggable();
Aloha.jQuery('#' + me.myId).aloha();

同样，这个允许编辑但不能拖动。

似乎当手柄出现调整大小或拖动事件时，aloha 编辑器停止工作，但是如果没有手柄，拖动和调整大小停止工作。有什么建议吗，或者以前有人遇到过吗？

【问题讨论】：

标签： extjs extjs4 jquery-draggable aloha-editor html5-draggable

【解决方案1】：

为了解决这个问题，我做了一个移动处理程序，HTML5 样式：

http://www.w3schools.com/html/html5_draganddrop.asp

并将我的主画布作为放置区域。

接下来我在组件内添加了一个可编辑的小 div。

并且能够制作那个 div aloha。然后，只要您使边缘透明，默认大小调整器就可以工作。

【讨论】：