Question

我想要一个绑定到Array的Items列表。例如项目将具有标题，描述和图像。

我会有一个Drop PlaceHolder，它有一个或多个“标题，描述，图像”。

当我将项目拖到PlaceHolder上时如果组件存在，组件将会更新。

对此有任何帮助将不胜感激。

Answer 1

您可以使用ui.draggable：

来拖动元素

$( ".draggable" ).draggable({ revert:true });
$( "#placeholder" ).droppable({
    drop: function( event, ui ) {
        var draggable = $(ui.draggable);
        var droppable = $(this);

        // Update droppable using draggable's sub-itens
        droppable.find(".title").html(draggable.find(".title").html());
        droppable.find(".description").html(draggable.find(".description").html());
        droppable.find(".image").attr("src",draggable.find(".image").attr("src"));
    }
});

其余的将取决于你想对拖拽者做什么：将他们的sub-itens'内容复制到占位符？克隆并替换占位符？用原始文件替换占位符？

上面的示例假定您将使用拖动元素的内容更新占位符的内容（并且每个项的属性将由类标识）。如果您需要有关可拖动的更多信息（例如，它们在源数组中的索引），则可以使用data函数。

jQuery拖放绑定多个项目

1 个答案: