jQuery UI 可排序更新事件

jQuery UI 是以 jQuery 为基础的一套用户界面组件库，其中包含了大量方便实用的 UI 组件和工具方法。其中，可排序组件 (sortable) 就是一个可以让用户拖拽排序的组件，可以应用于很多场景中。

当用户拖拽排序完成后，我们通常需要对更新后的信息进行处理，这时候就需要使用 jQuery UI 可排序的更新事件。

可排序更新事件

当使用 jQuery UI 可排序组件进行拖拽排序后，更新后的数据可以绑定到 sortable 的 update 事件上，该事件会在拖动排序结束之后触发。

$( ".selector" ).sortable({
  // 其他配置项
  update: function( event, ui ) {
    // 更新后的处理代码
  }
});

在 update 事件中，我们可以通过参数 ui 来获取更新后的信息，其中包含了原先所在的位置、当前所在的位置、排序后的所有元素等信息。

update: function( event, ui ) {
  var oldIndex = ui.item.index();
  var newIndex = ui.item.index();
  var sortedElements = $( ".selector" ).sortable( "toArray" );
  // do something
}

除了 update 事件外，还可以对拖动过程中的其他事件进行监听，例如 start、change 等，从而实现更为精细的拖动效果。

总结

通过使用 jQuery UI 可排序更新事件，我们可以轻松实现拖拽排序后的数据处理，为用户带来更好的操作体验。同时，还可以根据需求扩展更多事件，实现更为灵活的拖动效果。