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 を抽出していることがわかります。したがって、上記の例のように、コンポジットが分解されます。これは、様式化された書式設定がゴースト ヘルパーから除外されることを意味します (とりわけ)。

私の解決策：確かにあまりエレガントではありませんが、ドラッグソースの構成をやり直して、テキストベースの小さな部分だけがjstreeでドラッグできるようにする必要がありました。

于 2013-04-27T17:08:21.520 に答える