Question

我有这个系统通过将图像项拖放到div id="trash"中来创建所选图像的列表。

此系统是jquery ui页面中照片管理器的副本： Link

我想要实现的是在每个图像样本中都有一个向上箭头图标，以便将其插入列表而不必拖动它。

我设法附加了元素，但是我无法调用函数deleteImage（），因此在将元素放入列表中后，它会像动画一样动画。

这是项目的JSFIDDLE

这是我到目前为止所做的：

$('a.quick_insert').click( function(){
  var sample = $("<li />").append($(this).closest($('li')).clone()).html();
  $(this).closest($('li')).fadeOut(function(){
    $('#trash').append(sample).fadeIn(function() {
      var $list = $( "ul", $trash ).length ?
      $( "ul", $trash ) :
      $( "<ul class='gallery ui-helper-reset'/>" ).appendTo( $trash );

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

    });
  });
});

谢谢

Answer 1

尝试更改您的代码：

// Quick Insertion
$('a.quick_insert').click( function(){
    deleteImage( $(this).parent() );
});

因此，您将通过将当前单击的容器作为元素传递来重用示例的相同功能。

演示：http://jsfiddle.net/gqSaq/5/

修改

要让循环正常工作，您必须委托其单击on，因为该元素是动态创建的。

代码：

// Quick Insertion
$('#gallery li').on('click', 'a.quick_insert', function () {
   deleteImage($(this).parent());
});

演示：http://jsfiddle.net/gqSaq/6/

使用Jquery ui Droppable将元素直接插入div

1 个答案:

修改