在可排序的jquery ui中自定义拖放

Customize drag and drop in sortable jquery ui

本文关键字:自定义 拖放 ui jquery 排序      更新时间:2023-09-26

我使用jquery ui连接列表在2个uls之间拖放。现在拖放操作正常。我想为这两种滴剂编写自定义功能。我将如何实现这一点?

我尝试了以下操作,但对我不起作用(这对两次下降都执行)

  $("#sortable1").sortable({
    update: function (event, ui) {
        debugger;
        var id = ui.item.attr("id");
        alert(id);
        var val = ui.item.val();
        alert(val);
        var index = ui.item.index()+1;
        alert(index)
    }
});

这不会对两次下降都执行

 $("#sortable2").droppable({
    update: function (event, ui) {
        debugger;
        var id = ui.item.attr("id");
        alert(id);
        var val = ui.item.val();
        alert(val);
        var index = ui.item.index() + 1;
        alert(index)
    }
});

我需要使用接收而不是更新

对于第一个ul下降功能:

$("#sortable1").droppable({
receive: function (event, ui) {
    debugger;
    var id = ui.item.attr("id");
    alert(id);
    var val = ui.item.val();
    alert(val);
    var index = ui.item.index() + 1;
    alert(index)
}});

对于第二个ul下降功能:

$("#sortable2").droppable({
receive: function (event, ui) {
    debugger;
    var id = ui.item.attr("id");
    alert(id);
    var val = ui.item.val();
    alert(val);
    var index = ui.item.index() + 1;
    alert(index)
}});