0

嗨，我希望有人可以帮助我找出我在拖放可排序时遇到的错误。目前，我将左侧的元素包含在一个 div 中，我称之为可拖动区域。在右侧，我有放置区。拖放与可排序一起工作得很好，但是当我启用可编辑功能时，排序不起作用，但可编辑工作得很好。

为了在放置区域内进行可编辑工作，我必须添加..

handle: '.sortable-handle'  to  .sortable({})

但是，当启用此句柄时，排序会停止。我希望能够在放置区域内拖放、排序和编辑元素。我使用 Froala 文本编辑器来实现可编辑功能

这是一个工作示例：http: //jsfiddle.net/darinnj/bdaerfyq/

让我知道是否有人有有效的方法来实现这一点。

4

1 回答 1

0

我用处理程序更新了您的 jsFiddle，以便在您放下项目后拖动它们。http://jsfiddle.net/bdaerfyq/4/

$('.contentTitle:not([data-initialized])').editable({
  initOnClick: true,
  buttons: ['formatBlock', 'blockStyle', 'bold', 'italic', 'underline', 'strikeThrough', 'color', 'align', 'outdent', 'indent', 'createLink', 'undo', 'redo', 'inserthorizontalrule'],
  blockTags: ["h1", "h2", "h3", "h4", "h5", "h6"]
}).attr('data-initialized', true).parent().append('<span class="sortable-handle"></span>');

此外，停止处理程序上的传播也很重要，这样它就不会进一步传播到编辑器。

$('body').on('.sortable-handle', function (e) {
    e.stopPropagation();
});
于 2014-09-09T21:07:47.287 回答