4

このサイトをjQuery関連の問題のリソースとして頻繁に使用していますが、今回は答えが見つからないようです。これが私の最初の投稿です。

昼間の仕事では、MSWord文書を生成するための情報システムを開発しています。私が開発しているモジュールの1つは、目次のデフォルトの章選択を定義し、指定された章ごとにテキストを選択するためのものです。ユーザーは新しいチャプターを送信し、必要に応じて、それらをチャイルドチャプターとして親に追加し、「ADopt in TOC」としてフラグを付け、デフォルトのテキスト（別のモジュールから）をチャプターにリンクできます。

私のチャプターリストはMySQLテーブルから再帰的に取得され、次のようになります。

<ul class="sortableChapterlist">
  <li>1</li>
  <li>2
    <ul class="sortableChapterlist">
      <li>2.1</li>
      <li>2.2</li>
      <li>2.3
        <ul class="sortableChapterlist">
          <li>2.3.1</li>
          <li>2.3.2</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

FireFoxでは、コードは魅力のように機能しますが、IE（7）はそれほど好きではないようです。メインチャプターの周りを正しくドラッグすることしかできません。サブチャプターをドラッグしようとすると、レベルに関係なく、対応するメインチャプターがすべてではなく、一部の子供と一緒に持ち上げられます。

これは、タスクを実行するために使用しているjQueryコードです。

$(function(){
  $(".sortableChapterlist").sortable({
    opacity: 0.7,
    helper:  'clone',
    cursor:  'move'
  });

  $(".sortableChapterlist").selectable();
  $(".sortableChapterlist").disableSelection();
});

誰かがこれについていくつかのアイデアを持っていますか？IEは、ドラッグ可能/ソート可能を処理しようとしているjQueryと組み合わせて、複数のクラス参照「chapter_list」に分類されると思います。

4

2 に答える 2

3

<ul>ツリー内のすべてではなく、ルート要素にsortableを適用するだけで、これを修正できると思います。これは私がテストしたすべてのブラウザで機能しますが、残念ながら、「ジャンプ」をかなりドラッグした後にアイテムが挿入される位置として、少しスムーズなエクスペリエンスにつながりません。

基本的に、これは次のようになります。

<ul id="sortableNestedList" class="sortableChapterlist">
  <li>1</li>
  <li>2
    <ul class="sortableChapterlist">
      <li>2.1</li>
      <li>2.2</li>
      <li>2.3
        <ul class="sortableChapterlist">
          <li>2.3.1</li>
          <li>2.3.2</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

$("#sortableNestedList").sortable({ ... });
于 2009-11-19T13:56:38.757 に答える
2

これは一筋縄ではいきませんが、アンダースコアをハイフンなどの別のものに置き換えてみてください。一部のブラウザでは、アンダースコアが原因で問題が発生していました。

Mozilla Developer Center:クラス名と ID 名の下線。

于 2009-11-18T10:17:34.563 に答える