是否可以在排序时“暂停”删除事件以向用户提问(jquery-ui 可排序)?

Is it possible to "pause" a drop event when sorting to ask a user a question (jquery-ui sortable)?

提问人:Ben Holness 提问时间:8/31/2023 更新时间:8/31/2023 访问量:28

问:

我正在处理一个使用 jquery-ui 可排序小部件的项目。

在某些情况下,我需要向用户询问一个与排序相关的问题,然后回调的行为会根据他们的回答而有所不同。update

我使用内置功能可以做到这一点,但是我需要能够自定义按钮,这是不可能的。Jsfiddle 链接如下。confirm

如果我切换到自定义提示,那么我认为我不能阻止它,这意味着排序在用户回答问题之前就完成了。

有没有办法可以“暂停”排序,直到用户回答问题,这样我就可以最终获得以下示例的等效功能,但使用自定义的确认对话框?

出于这个问题的目的,我们可以假设自定义确认对话框可以按如下方式调用(基于 jsfiddle 中的代码):

beforeStop:function(e,u) {
  // Pause the sort

  customConfirmDialog("Do you want to do something special?", function(result) {
    if (result) {
      // They said yes
      u.item.addClass("special");
     }

     // Allow the sort to continue here

  });
}

jsfiddle

jquery-ui-sortable

评论

0赞 Twisty 9/8/2023
没有好办法用 sortable “暂停”排序。用户仍在拖动项目(鼠标按钮向下)。当用户停止拖动(鼠标按钮向上)时,项目将被丢弃并被触发。您可以使用自定义拖放来执行此操作,当拖动停止时,您可以提出查询,并在他们以一种或另一种方式确认后执行类似拖放的事件,在删除项目之前修改项目。beforeStop

答:

0赞 scrhartley 8/31/2023 #1

如果您阅读 cancel 方法的文档,它会说:

取消当前可排序对象中的更改,并将其恢复到当前排序开始之前的状态。在停止和接收回调函数中很有用。

我假设您可以随时取消活动,然后在他们确认后自行移动项目。您可能可以记录占位符的前一个同级(或者如果它本身,如果在 stop 方法中,我猜)以便知道放置它的位置(如果移动到列表顶部,则为空)。

您可能还需要使用 refresh 和/或 refreshPositions 才能使一切正常(我猜)。refreshPositions

评论

0赞 Ben Holness 8/31/2023
这将是丑陋的,因为它会在用户回答问题时将项目放回原来的位置。我宁愿让它徘徊在他们放下它的地方,直到他们决定是否可能。
0赞 scrhartley 8/31/2023
那么也许恰恰相反?确认后添加类,否则手动将项目移回,如果这是您要实现的目标?
0赞 Ben Holness 8/31/2023
项目不会移回,它会更改更新时发送到服务器的内容,这可能会导致其他项目自动移动。如果没有人根据我的问题提出暂停排序的方法,这可能必须是我的方式。谢谢!
0赞 scrhartley 8/31/2023
任何基于 JS 的东西都必须是异步的,否则它会冻结 UI 线程,并且您无论如何都无法单击任何内容(当可排序线程被阻止时,没有 JS 线程来处理点击,因为 JS 没有线程)。这只能通过确认/警报/提示来实现,因为浏览器正在为您呈现它,因此可以在阻止整个选项卡的 JS 的同时与之交互。