0

オブジェクトをある div から別の div にドラッグ アンド ドロップすると、li の形式はテキストのみに変更されます。ドロップした後、同じ形式とスタイル、つまり「li」でそれが必要です。

 $(function() {

     $( "#catalog ul" ).sortable({
         zIndex: 10000,
            revert: true
        });
     $( "#catalog" ).accordion();
     $( "#catalog ul" ).draggable({
            appendTo: "body",
            helper: "clone",
            zIndex: 10000
        });

      $( "#dialogIteration ol" ).droppable({

            activeClass: "ui-state-default",
            hoverClass: "ui-state-hover",

            drop: function( event, ui ) {
                $( this ).find( ".placeholder" ).remove();
                $( "<li></li>" ).text( ui.draggable.text() ).appendTo( this );
            }
        }).sortable({
            items: "li:not(.placeholder)",
            sort: function() {

                // gets added unintentionally by droppable interacting with sortable
                // using connectWithSortable fixes this, but doesn't allow you to customize active/hoverClass options
                $( this ).removeClass( "ui-state-default" );
            }
        });


        $( "ul, li" ).disableSelection();
        $("#dialogIteration").dialog();
    });

デモ: http://jsfiddle.net/coolanuj/7683X/7/

4

1 に答える 1

2

2番目のdivにドロップされた要素がそのフォーマットを保持することを望んでいると思いますか？もしそうなら、あなたのjsfiddleを見ると、2つの潜在的な問題がわかります。

1）ドロップ可能な定義で、新しいli要素を作成しますが、インラインスタイル間でコピーしません（したがって、色の定義が失われるなど）

2）CSSでは、スタイルを最初のdivのulにのみ適用し、2番目のdivのolには適用しません。

于 2012-11-07T05:14:58.953 に答える