0

我试图让用户将列表项拖到另一个未排序的列表中。我可以“拾取”列表项,因此 Draggable 似乎可以工作,但是当我将它们释放到 DropTarget 上方时,它们不会被添加。我添加了一些事件来检查 Draggable 和 DropTarget 是否都已正确初始化,并且看起来它们是正确的。

HTML:

<ul id="recipe-steps">
    <li>Step 1</li>
    <li>Step 2</li>
    <li>Step 3</li>
</ul>
<ul id="available-steps">
    <li>Step 1</li>
    <li>Step 2</li>
    <li>Step 3</li>
</ul>

DropTarget JS代码:

$("#recipe-steps").kendoDropTarget({
    dragleave: function (e) {
        e.draggable.hint.css("opacity", 1);
    },
    dragenter: function (e) {
        e.draggable.hint.css("opacity", 0.3);
    }
});

可拖动的JS代码:

$("#available-steps").kendoDraggable({
    filter: "li",
    ignore: "input",
    hint: function(element) { return element.clone(); }
});

所以这里的用例是用户可以将一个步骤从可用步骤拖到配方步骤。

4

0 回答 0