javascript - 如何使用 jQuery UI 在 contenteditable div 中拖放文本

标签 javascript jquery jquery-ui jquery-ui-draggable jquery-draggable

我正在尝试移动可内容编辑的 div 中的可拖动文本。

这是div:

<div class="droppable_tag" contenteditable="true">Facebook shuts down friends data <a contenteditable="false" class="draggable_tag">API</a> to generate more trust among users</div>

目标是让该文本(在本例中为“API”)在其被放置在放置位置后重新插入到 contenteditable div 中。我试过获取 div 的值,但不知道如何将可拖动对象插入其中。

这是代码: https://jsfiddle.net/gsLq7cxy/1/

感谢任何帮助!

最佳答案

您最好使用 sortable method反而;它具有可拖动的所有属性,但会根据项目的放置位置重新排序所有项目。

您需要将每个单词包装在一个元素中,例如 span(请参阅 this post 了解解决方案),然后使父级可排序:$( ".droppable_tag").sortable(); .

关于javascript - 如何使用 jQuery UI 在 contenteditable div 中拖放文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29942604/

相关文章:

提交时的 jQuery 文档

javascript - jQuery 上一个按钮未按预期工作

jquery - 配对多个 jQueryUI 可排序而不交叉

css - 如何使用调整大小栏处理调整大小事件?

PHP 循环内的 Javascript 文件转换

javascript - window.location.href 中的正斜杠重定向到根 url

javascript - 在 Jquery 中仅将列表记录添加到容器中一次

javascript - 允许退格的javascript中的正则表达式

javascript - 如何更改父偏移值而不更改其子偏移?

css - jQueryUI slider : absolutely positioned element & parent container height