1

Jquery uiを使用してドラッグアンドドロップをシミュレートしようとしていますが、ドラッグアンドドロップ時に元のリストからアイテムを削除しないようにするにはどうすればよいですか？この場合、アイテムをギャラリーに保持したいのですが、ゴミ箱にクローンします。

Jsbinの例http://jsbin.com/igevut/1/edit

   $trash.droppable({
      accept: "#gallery > li",
      activeClass: "ui-state-highlight",
      drop: function( event, ui ) {
        deleteImage( ui.draggable );
      }
    });

function deleteImage( $item ) {
      $item.fadeOut(function() {
        var $list = $( "ul", $trash ).length ?
          $( "ul", $trash ) :
          $( "<ul class='gallery ui-helper-reset'/>" ).appendTo( $trash );

        $item.find( "a.ui-icon-trash" ).remove();
        $item.append( recycle_icon ).appendTo( $list ).fadeIn(function() {
          $item
            .animate({ width: "48px" })
            .find( "img" )
              .animate({ height: "36px" });
        });
      });
    }
4

2 に答える 2

2

$item = $item.clone()関数の先頭に追加するだけdeleteImageです。

于 2013-01-23T00:20:18.583 に答える
0

メソッドを使用して、ドラッグ可能なオブジェクトの複製オブジェクトとして機能するヘルパーを返すことができます。

 $( "li", $gallery ).draggable({
      cancel: "a.ui-icon", // clicking an icon won't initiate dragging
      revert: "invalid", // when not dropped, the item will revert back to its initial position
      containment: "document",
      helper: getHelper,
      cursor: "move"
    });

function getHelper(event){

  // return html for the helper
}

例については、リンクhttp://shyalika.com/create_drag_and_drop_exampleを参照してください。

于 2013-01-23T05:36:24.443 に答える