jQWidgets jqxSortable 更新事件

jQWidgets jqxSortable 是一个功能强大的 jQuery 插件，能让你很容易地实现拖放排序功能。除此之外，它还提供了一些非常有用的事件，其中最重要的就是 update 事件。本文将为你介绍 jQWidgets jqxSortable 的更新事件。

更新事件介绍

更新事件在 jQWidgets jqxSortable 中非常重要，因为它会在拖动过程中持续触发，直至拖放操作完成。与其他事件不同，更新事件会提供一些关于当前被拖动元素的有用信息，包括被拖动元素的位置，以及其它一些有用的信息。

触发更新事件的条件

在拖动元素的过程中，只要被拖动元素的位置发生变化，更新事件就会被触发。这就意味着你可以在元素的任何状态下绑定更新事件，而无需担心事件会被误触发。

更新事件返回的参数

更新事件会返回一个对象，包含了一些有用的信息：

• position - 被拖动元素的位置信息，包括 left 和 top 坐标。
• item - 被拖动元素的 jQuery 对象。
• source - 被拖动元素的源位置信息，包括 left 和 top 坐标。
• target - 被拖动元素的目标位置信息，包括 left 和 top 坐标。
• reference - 调用此事件的排序器元素的 jQuery 对象。
• instance - 被调用的 jQWidgets jqxSortable 实例的引用。
• otherItems - 其他被排序的元素。

// onUpdate event handler
function onUpdate(event) {
    console.log("position:", event.position);
    console.log("item:", event.item);
    console.log("source:", event.source);
    console.log("target:", event.target);
    console.log("reference:", event.reference);
    console.log("instance:", event.instance);
    console.log("otherItems:", event.otherItems);
}

代码片段

// Bind the onUpdate event
$("#sortable").jqxSortable({ onUpdate: onUpdate });

// onUpdate event handler
function onUpdate(event) {
    console.log("position:", event.position);
    console.log("item:", event.item);
    console.log("source:", event.source);
    console.log("target:", event.target);
    console.log("reference:", event.reference);
    console.log("instance:", event.instance);
    console.log("otherItems:", event.otherItems);
}

除了更新事件，jQWidgets jqxSortable 还提供了许多其它的事件，如开始拖动事件、停止拖动事件等等。你可以查看 jQWidgets jqxSortable 的文档来了解更多有关可用事件的信息。