可调整大小的tinyMCE实例不能与jqueryUI的.draggable一起使用

我有一个动态创建的TinyMCE textarea(使用外部工具栏),在一个容器div内。我试图让它可以拖动,并调整大小(整个文本区域)。

jQueryUI的.draggable()与tinyMCE协同工作,但如果使用.resizable(),当点击该区域时,不会出现tinyMCE外部工具栏。如果我在其设置中使用tinyMCE的调整大小选项,当我点击拖动来调整大小时,它会打破jqueryUI的可拖动功能(整个框跟随鼠标以及调整大小,并且不会放开)。

0
额外 编辑
意见: 1
你们是否设法解决这个问题?
额外 作者 user961627,
我有完全相同的问题。你的问题是:你如何将可调整大小拖到tinymce区域?
额外 作者 Andrei Cristian Prodan,

2 答案

我使用jQuery UI可拖动的句柄选项和拖动函数回调来解决此问题:

div.draggable.handle = "div[role=group], td.mceLast";
div.draggable.drag = function ( event, ui ) {
    if ( $( event.srcElement ).is( '.mceResize' ) || $( event.originalEvent.target ).is( '.mceResize' ) ) {

        return false;
    }
};
0
额外

这是解决方案

“.mce-resizehandle”是tinymce调整大小按钮的类

$( ".selector" ).resizable({
  cancel: ".mce-resizehandle,input,textarea,button,select,option",
});

$( ".selector" ).draggable({
  cancel: ".mce-resizehandle,input,textarea,button,select,option",
});
0
额外