0

我正在动态创建一些应该可以拖放到 JSTree 组件上的元素。树已配置并且拖动过程正在运行,但它并没有像预期的那样工作。

拿这个 HTML 片段:

<div id="newDragEntry_1" class="newDragEntry">
  <div class="floatLeft">
    <span class="newEntryThumbtab">#</span>
    <span class="newEntryLabel">asdfasdf</span>
  </div>
  <div class="floatRight">
    <span class="newEntryFilename">(LICENSE)</span>
    <span id="newEntryIcon_1" class="newEntryIcon">
      <img src="/img/lib/icons/mime/pdf.png">
    </span>
  </div>
</div>

那是一个分配了“newDragEntry”类的容器 div - 这就是 jsTree 被配置为识别的内容。问题是用户在开始拖动时碰巧抓住的任何内部元素都会成为实际的拖动对象。因此,如果他们抓住文本“LICENSE”,那么这就是被幻影和拖动的东西——而不是整个 #newDragEntry_1 元素(它在样式化时就像一个按钮。)

有人有什么想法吗?

(FWIW - 我可以通过直接使用 jq 的 .draggable() 方法来获得我正在寻找的拖动行为,但是我似乎没有得到 jstree 触发的任何放置事件?)

4

1 回答 1

0

经过大量挖掘后,我得出的结论是,解决这个问题需要在 jsTree 中修改代码库或进行健康的手动事件跟踪(即,您自己的叠加拖动逻辑。)

如果有人发现自己在这里寻找解决方案,那么可以从 jstree 源代码(版本:jsTree 1.0-rc3)中的这个片段开始:

var s = this._get_settings().dnd;
if(s.drag_target) {
  $(document)
    .delegate(s.drag_target, "mousedown.jstree-" + this.get_index(), $.proxy(function (e) {
  o = e.target;
  $.vakata.dnd.drag_start(e, { jstree : true, obj : e.target }, "<ins class='jstree-icon'></ins>" + $(e.target).text() );

最后一行是重要的。最后,您会看到它正在从冒泡的拖动事件发起者中提取 TEXT - 因此像我上面的示例一样分解了复合材料。这意味着任何风格化的格式都将从 ghost 助手中排除(除其他外)。

我的解决方案:肯定不是很优雅,但我不得不重做拖动源的组合,以便只有一个较小的基于文本的部分是 jstree 可拖动的。

于 2013-04-27T17:08:21.520 回答