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 回答