如何找到使用 Jquery 可排序移动的元素的新 div id？答案

【问题标题】：How can I find the new div id of an element moved with Jquery sortable?如何找到使用 Jquery 可排序移动的元素的新 div id？
【发布时间】：2023-04-04 04:38:01
【问题描述】：

我想知道我刚刚移动的元素的新位置（div id）

我该怎么做？

http://jqueryui.com/demos/sortable/#empty-lists

<script>
    $(function() {

        $("#sortable").sortable({
    update: function(event, ui) {
        alert("New position: " + ui.item.index());
    }
});

        $( "ul.droptrue" ).sortable({
            connectWith: "ul"
        });

        $( "ul.dropfalse" ).sortable({
            connectWith: "ul",
            dropOnEmpty: false
        });

        $( "#sortable1, #sortable2, #sortable3" ).disableSelection();
    });
    </script>


<ul id="sortable1" class='droptrue'>
    <li class="ui-state-default">Can be dropped..</li>
    <li class="ui-state-default">..on an empty list</li>
    <li class="ui-state-default">Item 3</li>
    <li class="ui-state-default">Item 4</li>
    <li class="ui-state-default">Item 5</li>
</ul>

<ul id="sortable2" class='dropfalse'>
    <li class="ui-state-highlight">Cannot be dropped..</li>
    <li class="ui-state-highlight">..on an empty list</li>
    <li class="ui-state-highlight">Item 3</li>
    <li class="ui-state-highlight">Item 4</li>
    <li class="ui-state-highlight">Item 5</li>
</ul>

<ul id="sortable3" class='droptrue'>
</ul>

【问题讨论】：

你的代码很好。我觉得你拼错了（“#sortable”）。我猜应该是 ("#sortable1")。
不知道你怎么会接受一个与问题无关的答案？

标签： jquery sortables

【解决方案1】：

在您的回调中，您可以使用event.pageX 和event.pageY 来确定相对于页面的偏移量。

【讨论】：

【解决方案2】：

一旦您对页面中实际存在的元素调用sortable()，您的代码就可以完美运行（参见this fiddle）：

$("#sortable2").sortable({
    update: function(event, ui) {
        alert("New position: " + ui.item.index());
    }
});

【讨论】：