1

我有一个有点像这样的滑块：

             ________
------------|        |---------------------------------------
   :    <-- | slider | -->    :        :        :        :
------------|________|---------------------------------------

我正在使用 jQuery UI 使滑块可拖动。这工作正常。

问题是每次滑块越过部分边界（由 表示:）时，我都在执行一个函数。该函数执行大约需要 30 毫秒（它正在构建 DocumentFragment 并将其插入到文档中）。在此期间浏览器不响应事件，因此 jQuery UI 停止调整滑块的位置并且拖动提前结束（用户被迫释放鼠标按钮并开始新的拖动）。这使滑块感觉生涩和错误。

这个问题有解决方案吗？

编辑：我创建了一个简单的小提琴来演示这个问题。请注意，虽然在执行慢速函数期间拖动实际上是暂停的，但它会在之后恢复。这让我怀疑我的更复杂的场景中有一些东西导致拖动事件被缩短（也许 DOM 操作导致滑块的位置短暂改变）。

编辑：经过进一步调查，我更接近于理解这个问题。DOM 操作代码包含类似$('.droppable').remove(). 这会在分离绑定到它们的任何事件处理程序并删除任何关联数据后从 DOM 中删除匹配的元素。如果我.detach()改用，则行为与上面的简单小提琴相同。清理期间发生了一些不愉快的事情。

4

1 回答 1

0

我建议使用 jQuery 或 Underscore 的debounce函数，或一些等效的方法，每 100 或 200 毫秒左右调用一次该函数。

这不会让事情变得顺利，但至少他们不会觉得有问题。

关于它的有趣文章。

于 2012-08-12T20:11:57.783 回答